/* ========================================================================== OriginRealm Light Theme — Eye-Comfort Soft Slate Stylesheet Applied exclusively when [data-theme="light"] is active on . Dark mode is 100% preserved and untouched. Color Palette (Zero Glare, Sharp High-Contrast Typography): - Page Ambient: #dbe4ed (Soft calm dimmed slate gray — NOT blinding white) - Surface Cards: #edf2f7 (Smooth slate surface with subtle elevation) - Sub-containers: #e2e8f0 (Inner items, chapter rows, search fields) - Deep Text: #0f172a (Crisp high-contrast slate navy for titles) - Body Text: #334155 (Legible, comfortable reading text) - Subtext / Meta: #475569 / #64748b - Borders: rgba(15, 23, 42, 0.12) / rgba(15, 23, 42, 0.18) - Royal Accent: #4f46e5 (Indigo) / #4338ca (Hover) ========================================================================== */ /* ─── 1. ROOT & GLOBAL ELEMENT RESETS ───────────────────────────────────── */ [data-theme="light"] { --bg-primary: #dbe4ed !important; --bg-secondary: #d0dbe6 !important; --bg-tertiary: #c4d1de !important; --bg-card: #edf2f7 !important; --card-bg: #edf2f7 !important; --card-bg-hover: #f4f8fc !important; --card-border: rgba(15, 23, 42, 0.12) !important; --card-hover-border: rgba(79, 70, 229, 0.45) !important; --text-primary: #0f172a !important; --text-secondary: #334155 !important; --text-tertiary: #475569 !important; --text-muted: #64748b !important; --border: rgba(15, 23, 42, 0.12) !important; --border-light: rgba(15, 23, 42, 0.18) !important; --border-accent: rgba(79, 70, 229, 0.35) !important; --accent: #4f46e5 !important; --accent-hover: #4338ca !important; --accent-primary: #4f46e5 !important; --accent-primary-hover: #4338ca !important; --accent-secondary: #7c3aed !important; --glass-bg: rgba(237, 242, 247, 0.94) !important; --glass-border: rgba(79, 70, 229, 0.25) !important; --glass-shadow: 0 8px 24px rgba(15, 23, 42, 0.08) !important; } html[data-theme="light"], html[data-theme="light"] body, html[data-theme="light"] body:not(.series-detail), html[data-theme="light"] body.series-detail { background-color: #dbe4ed !important; background: #dbe4ed !important; color: #0f172a !important; } [data-theme="light"] main { background: transparent !important; } /* Light Scrollbars */ [data-theme="light"] ::-webkit-scrollbar-track { background: #cbd5e1 !important; } [data-theme="light"] ::-webkit-scrollbar-thumb { background: #94a3b8 !important; border-radius: 6px !important; } [data-theme="light"] ::-webkit-scrollbar-thumb:hover { background: #64748b !important; } /* ─── 2. WELCOME / HOME PAGE HERO & FEATURED SLIDER ─────────────────────── */ [data-theme="light"] .home-page-title { color: #0f172a !important; } [data-theme="light"] .home-page-subtitle { color: #475569 !important; } [data-theme="light"] .featured-slider .slider-wrapper, [data-theme="light"] .slider-wrapper { background: linear-gradient(135deg, #e8eff6 0%, #dce5ef 100%) !important; border: 1px solid rgba(79, 70, 229, 0.22) !important; box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08), 0 0 20px rgba(79, 70, 229, 0.05) !important; } [data-theme="light"] .slide { background: transparent !important; } [data-theme="light"] .slide-info h2 { color: #0f172a !important; } [data-theme="light"] .slide-info p { color: #334155 !important; } [data-theme="light"] .slide-cover { border: 1px solid rgba(15, 23, 42, 0.15) !important; box-shadow: 0 8px 20px rgba(15, 23, 42, 0.12), 0 0 12px rgba(79, 70, 229, 0.08) !important; } [data-theme="light"] .slide-info .tag, [data-theme="light"] .genre-tags .tag, [data-theme="light"] .tag { background: rgba(79, 70, 229, 0.12) !important; border: 1px solid rgba(79, 70, 229, 0.25) !important; color: #3730a3 !important; } [data-theme="light"] .slide-info .btn-primary, [data-theme="light"] .btn-read-info { background: linear-gradient(135deg, #4f46e5 0%, #4338ca 100%) !important; color: #ffffff !important; border: 1px solid rgba(255, 255, 255, 0.2) !important; box-shadow: 0 4px 14px rgba(79, 70, 229, 0.35) !important; } [data-theme="light"] .slide-info .btn-primary:hover { background: linear-gradient(135deg, #4338ca 0%, #3730a3 100%) !important; box-shadow: 0 6px 20px rgba(79, 70, 229, 0.5) !important; } /* Slider buttons */ [data-theme="light"] .slider-btn { background: rgba(214, 224, 236, 0.9) !important; backdrop-filter: blur(8px) !important; border: 1px solid rgba(15, 23, 42, 0.18) !important; color: #1e293b !important; box-shadow: 0 4px 12px rgba(15, 23, 42, 0.10) !important; } [data-theme="light"] .slider-btn:hover { background: #4f46e5 !important; border-color: #4f46e5 !important; color: #ffffff !important; box-shadow: 0 6px 16px rgba(79, 70, 229, 0.35) !important; } /* ─── 3. SECTION HEADERS & CONTROLS ─────────────────────────────────────── */ [data-theme="light"] .section-title { color: #0f172a !important; } [data-theme="light"] .section-title::before { background: linear-gradient(180deg, #4f46e5 0%, #7c3aed 100%) !important; box-shadow: 0 0 10px rgba(79, 70, 229, 0.45) !important; } [data-theme="light"] .view-all { background: rgba(79, 70, 229, 0.10) !important; border: 1px solid rgba(79, 70, 229, 0.22) !important; color: #3730a3 !important; } [data-theme="light"] .view-all:hover { background: rgba(79, 70, 229, 0.20) !important; color: #1e1b4b !important; border-color: rgba(79, 70, 229, 0.45) !important; } /* ─── 4. CARDS & SERIES GRIDS (Catalog, Browse, Welcome) ────────────────── */ [data-theme="light"] .card, [data-theme="light"] .series-card, [data-theme="light"] .series-card-glass, [data-theme="light"] .promoted-card { background: #edf2f7 !important; border: 1px solid rgba(15, 23, 42, 0.12) !important; box-shadow: 0 4px 14px rgba(15, 23, 42, 0.08) !important; } [data-theme="light"] .card-body, [data-theme="light"] .series-card-glass-body { background: #edf2f7 !important; } [data-theme="light"] .card:hover, [data-theme="light"] .series-card:hover, [data-theme="light"] .series-card-glass:hover, [data-theme="light"] .promoted-card:hover { background: #f4f8fc !important; border-color: rgba(79, 70, 229, 0.5) !important; box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12), 0 0 16px rgba(79, 70, 229, 0.10) !important; } [data-theme="light"] .card-title, [data-theme="light"] .series-title-glass, [data-theme="light"] .series-title, [data-theme="light"] .promoted-card .card-title { color: #0f172a !important; font-weight: 700 !important; } [data-theme="light"] .card-meta, [data-theme="light"] .series-meta-glass, [data-theme="light"] .promoted-card .card-description { color: #475569 !important; font-weight: 600 !important; } [data-theme="light"] .card-cover, [data-theme="light"] .card-image, [data-theme="light"] .card-cover-wrap, [data-theme="light"] .series-card-glass .card-cover-wrap { background: #cbd5e1 !important; } [data-theme="light"] .no-cover, [data-theme="light"] .card-no-cover, [data-theme="light"] .no-cover-card { background: #cbd5e1 !important; color: #475569 !important; } /* Instant CSS Placeholder Replacement for Light Theme */ [data-theme="light"] img[src*="placeholder.svg"] { content: url('/images/placeholder-light.svg') !important; } [data-theme="light"] .card-cover[src*="placeholder.svg"], [data-theme="light"] .slide-cover[src*="placeholder.svg"] { content: url('/images/placeholder-light.svg') !important; } [data-theme="light"] .type-badge { background: rgba(79, 70, 229, 0.10) !important; border: 1px solid rgba(79, 70, 229, 0.22) !important; color: #3730a3 !important; } [data-theme="light"] .overlay-type-badge { background: rgba(79, 70, 229, 0.85) !important; border: 1px solid rgba(79, 70, 229, 0.6) !important; color: #ffffff !important; } [data-theme="light"] .overlay-status-badge { color: #ffffff !important; } [data-theme="light"] .card-rating, [data-theme="light"] .rating { color: #d97706 !important; font-weight: 700 !important; } [data-theme="light"] .tiktok-follow-btn { background: #4f46e5 !important; border: 2px solid #edf2f7 !important; box-shadow: 0 2px 8px rgba(15, 23, 42, 0.15) !important; } /* ─── 5. PROMOTED SECTION ───────────────────────────────────────────────── */ [data-theme="light"] .promoted-section { background: linear-gradient(135deg, rgba(251, 191, 36, 0.10) 0%, rgba(245, 158, 11, 0.06) 100%) !important; border: 1px solid rgba(245, 158, 11, 0.25) !important; } [data-theme="light"] .promoted-badge { background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%) !important; color: #1e1b4b !important; box-shadow: 0 2px 8px rgba(245, 158, 11, 0.25) !important; } [data-theme="light"] .promote-your-series-cta { background: #e2e8f0 !important; border: 2px dashed rgba(245, 158, 11, 0.4) !important; } [data-theme="light"] .promote-info { color: #475569 !important; } /* ─── 6. SERIES DETAIL PAGE (`/series/{id}-{slug}`) — CRISP & HIGH CONTRAST ── */ [data-theme="light"] .nav-btn { background: rgba(214, 224, 236, 0.95) !important; border: 1px solid rgba(15, 23, 42, 0.18) !important; color: #1e293b !important; box-shadow: 0 4px 12px rgba(15, 23, 42, 0.10) !important; } [data-theme="light"] .nav-btn:hover { background: rgba(79, 70, 229, 0.15) !important; color: #3730a3 !important; border-color: rgba(79, 70, 229, 0.45) !important; box-shadow: 0 6px 16px rgba(79, 70, 229, 0.2) !important; } [data-theme="light"] .nav-btn-disabled { background: rgba(203, 213, 225, 0.6) !important; border: 1px solid rgba(15, 23, 42, 0.08) !important; color: #94a3b8 !important; } [data-theme="light"] .close-btn { background: rgba(214, 224, 236, 0.95) !important; border: 1px solid rgba(15, 23, 42, 0.14) !important; color: #475569 !important; box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08) !important; } [data-theme="light"] .close-btn:hover { background: #edf2f7 !important; color: #0f172a !important; } /* Main Series Info Shell */ [data-theme="light"] .series-detail-shell, [data-theme="light"] .series-detail-layout { background: #edf2f7 !important; border: 1px solid rgba(15, 23, 42, 0.12) !important; box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08) !important; } [data-theme="light"] .series-detail-shell .series-title { color: #0f172a !important; -webkit-text-fill-color: #0f172a !important; background: none !important; } [data-theme="light"] .series-detail-shell .series-title:hover { color: #4f46e5 !important; -webkit-text-fill-color: #4f46e5 !important; } /* Alt Title dropdown */ [data-theme="light"] .alt-title-primary, [data-theme="light"] #alt-title-primary { color: #475569 !important; } [data-theme="light"] .alt-title-primary:hover, [data-theme="light"] #alt-title-primary:hover { color: #3730a3 !important; } [data-theme="light"] .alt-title-toggle { background: rgba(79, 70, 229, 0.10) !important; border-color: rgba(79, 70, 229, 0.22) !important; color: #3730a3 !important; } [data-theme="light"] .alt-title-toggle:hover { background: rgba(79, 70, 229, 0.20) !important; border-color: rgba(79, 70, 229, 0.4) !important; color: #0f172a !important; } [data-theme="light"] .alt-title-menu, [data-theme="light"] #alt-title-menu { background: #edf2f7 !important; border: 1px solid rgba(79, 70, 229, 0.25) !important; box-shadow: 0 10px 30px rgba(15, 23, 42, 0.14) !important; } [data-theme="light"] .alt-title-menu-item, [data-theme="light"] #alt-title-menu button { color: #334155 !important; border-bottom: 1px solid rgba(15, 23, 42, 0.06) !important; } [data-theme="light"] .alt-title-menu-item:hover, [data-theme="light"] #alt-title-menu button:hover { background: rgba(79, 70, 229, 0.08) !important; color: #0f172a !important; } /* Info Grid Section — High Contrast & Sharp */ [data-theme="light"] .series-info-grid { background: #edf2f7 !important; border: 1px solid rgba(15, 23, 42, 0.12) !important; border-radius: 12px !important; box-shadow: 0 8px 20px rgba(15, 23, 42, 0.06) !important; border-top: 1px solid rgba(15, 23, 42, 0.12) !important; border-bottom: 1px solid rgba(15, 23, 42, 0.12) !important; } [data-theme="light"] .series-info-grid > div > span:first-child, [data-theme="light"] .info-item-label { color: #475569 !important; font-weight: 800 !important; letter-spacing: 0.06em !important; } [data-theme="light"] .series-info-grid > div > span:last-child, [data-theme="light"] .info-item-value, [data-theme="light"] .community-rating-count { color: #334155 !important; font-weight: 700 !important; } [data-theme="light"] #community-rating { color: #b45309 !important; } [data-theme="light"] .series-info-grid a, [data-theme="light"] .series-info-link { color: #1d4ed8 !important; font-weight: 700 !important; } [data-theme="light"] .series-info-grid > div > span:not(:first-child):not(.status-dot), [data-theme="light"] .series-info-grid > div > div > span:last-child { color: #0f172a !important; } [data-theme="light"] .series-info-grid a:hover, [data-theme="light"] .series-info-link:hover { color: #1e3a8a !important; } [data-theme="light"] .series-chapter-count-btn { background: transparent !important; border: 1px solid #cbd5e1 !important; border-radius: 6px !important; color: #4338ca !important; padding: 0.18rem 0.55rem !important; box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08) !important; } [data-theme="light"] .series-words-count-btn { background: transparent !important; border: 0 !important; border-radius: 0 !important; color: #4338ca !important; padding: 0 !important; box-shadow: none !important; } [data-theme="light"] .series-info-report-btn, [data-theme="light"] .series-info-report-link { background: #edf2f7 !important; border: 1px solid rgba(15, 23, 42, 0.14) !important; color: #4338ca !important; box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06) !important; } [data-theme="light"] .series-chapter-count-btn:hover, [data-theme="light"] .series-words-count-btn:hover { background: transparent !important; border-color: rgba(79, 70, 229, 0.32) !important; } [data-theme="light"] .series-chapter-count-btn:hover { box-shadow: 0 2px 5px rgba(79, 70, 229, 0.10) !important; } [data-theme="light"] .series-words-count-btn:hover { color: #312e81 !important; box-shadow: none !important; } [data-theme="light"] .series-info-report-btn:hover, [data-theme="light"] .series-info-report-link:hover { background: #dbe4ed !important; border-color: rgba(79, 70, 229, 0.28) !important; box-shadow: 0 4px 12px rgba(79, 70, 229, 0.10) !important; } [data-theme="light"] .series-chapter-menu, [data-theme="light"] .series-words-menu { background: #edf2f7 !important; border: 1px solid rgba(79, 70, 229, 0.25) !important; box-shadow: 0 10px 30px rgba(15, 23, 42, 0.14) !important; } [data-theme="light"] .series-chapter-menu-row, [data-theme="light"] .series-words-menu-row { color: #0f172a !important; border-bottom-color: rgba(15, 23, 42, 0.06) !important; } [data-theme="light"] .series-chapter-menu-label, [data-theme="light"] .series-words-menu-label { color: #64748b !important; } [data-theme="light"] .series-chapter-menu-value, [data-theme="light"] .series-words-menu-value { color: #4338ca !important; } /* Status colors in Info Grid */ [data-theme="light"] .status-text-ongoing { color: #047857 !important; font-weight: 800 !important; } [data-theme="light"] .status-text-completed { color: #1d4ed8 !important; font-weight: 800 !important; } [data-theme="light"] .status-text-hiatus { color: #b45309 !important; font-weight: 800 !important; } [data-theme="light"] .status-text-dropped { color: #b91c1c !important; font-weight: 800 !important; } /* Description / Summary Section */ [data-theme="light"] .series-summary-block h2, [data-theme="light"] .series-detail-meta-col h2, [data-theme="light"] .summary-heading { color: #0f172a !important; font-weight: 800 !important; } /* Details Source Badges */ [data-theme="light"] .details-source-badge { background: #dbe4ed !important; color: #1f2937 !important; border: 1px solid rgba(15, 23, 42, 0.16) !important; box-shadow: 0 1px 4px rgba(15, 23, 42, 0.06) !important; font-weight: 800 !important; } [data-theme="light"] .details-source-badge-official { background: rgba(16, 185, 129, 0.12) !important; color: #047857 !important; border-color: rgba(16, 185, 129, 0.25) !important; } [data-theme="light"] .details-source-badge-translated { background: rgba(59, 130, 246, 0.12) !important; color: #1d4ed8 !important; border-color: rgba(59, 130, 246, 0.25) !important; } [data-theme="light"] .details-source-badge-mtl { background: rgba(245, 158, 11, 0.12) !important; color: #b45309 !important; border-color: rgba(245, 158, 11, 0.25) !important; } [data-theme="light"] .details-source-badge-raw { background: rgba(139, 92, 246, 0.12) !important; color: #6d28d9 !important; border-color: rgba(139, 92, 246, 0.25) !important; } [data-theme="light"] .details-source-badge-user { background: transparent !important; color: #475569 !important; border-color: #cbd5e1 !important; box-shadow: none !important; } [data-theme="light"] .description-container { background: rgba(255, 255, 255, 0.72) !important; border: 1px solid rgba(15, 23, 42, 0.08) !important; } [data-theme="light"] .description-content { color: #334155 !important; font-weight: 500 !important; line-height: 1.65 !important; } [data-theme="light"] .description-overlay { background: linear-gradient(transparent, rgba(237, 242, 247, 0.95)) !important; } [data-theme="light"] .read-more-btn { background: #4f46e5 !important; border: 1px solid #6366f1 !important; color: #ffffff !important; box-shadow: 0 4px 12px rgba(79, 70, 229, 0.35) !important; } [data-theme="light"] .series-genre-pills { gap: 0.55rem !important; } [data-theme="light"] .series-genre-pill { background: #e0e7ff !important; color: #312e81 !important; border: 1px solid rgba(79, 70, 229, 0.22) !important; box-shadow: 0 1px 4px rgba(79, 70, 229, 0.08) !important; } [data-theme="light"] .series-genre-pill:hover { background: #c7d2fe !important; color: #1e1b4b !important; box-shadow: 0 4px 10px rgba(79, 70, 229, 0.12) !important; } /* Left Cover Column Buttons */ [data-theme="light"] .cover-gallery-btn { background: #e0e7ff !important; border: 1px solid #818cf8 !important; color: #3730a3 !important; font-weight: 700 !important; box-shadow: 0 2px 8px rgba(79, 70, 229, 0.15) !important; } [data-theme="light"] .cover-gallery-btn:hover { background: #c7d2fe !important; color: #1e1b4b !important; } [data-theme="light"] .cover-dmca-link { background: #fee2e2 !important; border: 1px solid #fca5a5 !important; color: #b91c1c !important; font-weight: 700 !important; } [data-theme="light"] .cover-dmca-link:hover { background: #fecaca !important; color: #991b1b !important; } /* Story / Art Credits Box */ [data-theme="light"] .cover-credit-box { background: #e2e8f0 !important; border: 1px solid rgba(15, 23, 42, 0.12) !important; box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06) !important; } [data-theme="light"] .cover-credit-text, [data-theme="light"] .series-detail-cover-col p { color: #334155 !important; } [data-theme="light"] .cover-credit-name { text-shadow: none !important; } [data-theme="light"] .cover-credit-name-author { color: #d97706 !important; } [data-theme="light"] .cover-credit-name-artist { color: #0284c7 !important; } /* Views & Uploader Pills */ [data-theme="light"] .series-meta-pills, [data-theme="light"] .views-pill, [data-theme="light"] .uploader-pill { color: #475569 !important; } [data-theme="light"] .views-pill, [data-theme="light"] .uploader-pill { background: #dbe4ed !important; border: 1px solid rgba(15, 23, 42, 0.14) !important; color: #1f2937 !important; box-shadow: 0 1px 4px rgba(15, 23, 42, 0.05) !important; font-weight: 700 !important; } [data-theme="light"] .views-pill svg, [data-theme="light"] .uploader-pill svg { opacity: 0.9 !important; } [data-theme="light"] .views-pill-text, [data-theme="light"] .uploader-pill-label { color: #334155 !important; } [data-theme="light"] .uploader-pill a { color: #3730a3 !important; font-weight: 800 !important; } [data-theme="light"] .related-series-heading, [data-theme="light"] .related-series-title { color: #0f172a !important; } [data-theme="light"] .related-series-type { color: #64748b !important; } /* Rating Stars Section */ [data-theme="light"] .series-rate-label, [data-theme="light"] #rating-stars .rating-star { color: #d97706 !important; text-shadow: 0 1px 2px rgba(180, 83, 9, 0.18) !important; } [data-theme="light"] #rating-stars .rating-star.active, [data-theme="light"] #rating-stars .rating-star:hover { color: #d97706 !important; text-shadow: 0 1px 2px rgba(180, 83, 9, 0.18) !important; } [data-theme="light"] #rating-value { color: #475569 !important; font-weight: 600 !important; } /* User Action Buttons (Rate, Add to Library, Stepper, Share) */ [data-theme="light"] .action-btn { background: #e2e8f0 !important; border: 1px solid rgba(15, 23, 42, 0.14) !important; color: #334155 !important; box-shadow: 0 2px 6px rgba(15, 23, 42, 0.05) !important; font-weight: 700 !important; } [data-theme="light"] .action-btn:hover { background: #d8e2ed !important; color: #0f172a !important; border-color: rgba(79, 70, 229, 0.4) !important; } [data-theme="light"] .favorite-btn-add { background: linear-gradient(135deg, #4f46e5 0%, #4338ca 100%) !important; color: #ffffff !important; border-color: rgba(255, 255, 255, 0.15) !important; box-shadow: 0 4px 14px rgba(79, 70, 229, 0.35) !important; } [data-theme="light"] .favorite-btn-remove { background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%) !important; color: #ffffff !important; border-color: rgba(255, 255, 255, 0.15) !important; } [data-theme="light"] .lib-status-badge { background: #e2e8f0 !important; border: 1px solid rgba(15, 23, 42, 0.15) !important; color: #0f172a !important; font-weight: 700 !important; } [data-theme="light"] .lib-dropdown { background: #edf2f7 !important; border: 1px solid rgba(79, 70, 229, 0.25) !important; box-shadow: 0 10px 30px rgba(15, 23, 42, 0.14) !important; } [data-theme="light"] .lib-dropdown-item { color: #334155 !important; border-bottom: 1px solid rgba(15, 23, 42, 0.06) !important; font-weight: 700 !important; } [data-theme="light"] .lib-dropdown-item.lib-status-reading { background: rgba(59, 130, 246, 0.10) !important; color: #1d4ed8 !important; } [data-theme="light"] .lib-dropdown-item.lib-status-completed { background: rgba(16, 185, 129, 0.10) !important; color: #047857 !important; } [data-theme="light"] .lib-dropdown-item.lib-status-plan { background: rgba(139, 92, 246, 0.10) !important; color: #6d28d9 !important; } [data-theme="light"] .lib-dropdown-item.lib-status-hold { background: rgba(245, 158, 11, 0.10) !important; color: #b45309 !important; } [data-theme="light"] .lib-dropdown-item.lib-status-dropped { background: rgba(239, 68, 68, 0.10) !important; color: #b91c1c !important; } [data-theme="light"] .lib-dropdown-item:hover { background: rgba(79, 70, 229, 0.08) !important; color: #0f172a !important; } [data-theme="light"] .lib-chapter-row { background: #e2e8f0 !important; border: 1px solid rgba(15, 23, 42, 0.14) !important; } [data-theme="light"] .lib-ch-btn { background: rgba(15, 23, 42, 0.06) !important; color: #334155 !important; } [data-theme="light"] .lib-ch-btn:hover { background: rgba(79, 70, 229, 0.14) !important; color: #0f172a !important; } [data-theme="light"] .lib-ch-label { color: #64748b !important; } [data-theme="light"] .lib-ch-input { color: #0f172a !important; } [data-theme="light"] #share-menu { background: #edf2f7 !important; border: 1px solid rgba(79, 70, 229, 0.25) !important; box-shadow: 0 10px 30px rgba(15, 23, 42, 0.14) !important; } [data-theme="light"] #share-menu a, [data-theme="light"] #share-menu button { color: #334155 !important; border-bottom: 1px solid rgba(15, 23, 42, 0.06) !important; } [data-theme="light"] #share-menu a:hover, [data-theme="light"] #share-menu button:hover { background: rgba(79, 70, 229, 0.08) !important; color: #0f172a !important; } /* Chapters Section Container */ [data-theme="light"] .series-chapters-shell { background: #edf2f7 !important; border: 1px solid rgba(15, 23, 42, 0.12) !important; box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08) !important; } [data-theme="light"] .chapters-header-controls h2 { color: #0f172a !important; } [data-theme="light"] .chapters-header-controls p { color: #64748b !important; } [data-theme="light"] .series-owner-banner { background: #ecfdf5 !important; border-color: rgba(16, 185, 129, 0.24) !important; box-shadow: 0 8px 20px rgba(16, 185, 129, 0.08) !important; } [data-theme="light"] .series-owner-banner-text { color: #14532d !important; } [data-theme="light"] .series-owner-banner-label { color: #047857 !important; } [data-theme="light"] .lang-stream-tab { background: #e2e8f0 !important; color: #64748b !important; border-color: rgba(15, 23, 42, 0.12) !important; box-shadow: 0 1px 4px rgba(15, 23, 42, 0.05) !important; } [data-theme="light"] .lang-stream-tab:hover { background: #dbe4ed !important; color: #0f172a !important; border-color: rgba(79, 70, 229, 0.3) !important; } [data-theme="light"] .lang-stream-tab.active { background: #4f46e5 !important; color: #ffffff !important; border-color: #4338ca !important; box-shadow: 0 4px 12px rgba(79, 70, 229, 0.25) !important; } [data-theme="light"] .lang-stream-tab .lang-tab-badge { background: rgba(15, 23, 42, 0.08) !important; color: inherit !important; } [data-theme="light"] .lang-stream-tab.active .lang-tab-badge { background: rgba(255, 255, 255, 0.18) !important; color: #ffffff !important; } [data-theme="light"] .chapters-count-badge { background: #e0e7ff !important; color: #312e81 !important; border-color: rgba(79, 70, 229, 0.22) !important; } [data-theme="light"] .chapters-studio-btn { background: #e0e7ff !important; color: #312e81 !important; border-color: rgba(79, 70, 229, 0.24) !important; box-shadow: 0 2px 8px rgba(79, 70, 229, 0.10) !important; } [data-theme="light"] .chapters-studio-btn:hover { background: #c7d2fe !important; color: #1e1b4b !important; border-color: rgba(79, 70, 229, 0.35) !important; } [data-theme="light"] .chapters-upload-btn { color: #ffffff !important; } [data-theme="light"] .chapter-notice { color: #334155 !important; box-shadow: 0 4px 14px rgba(15, 23, 42, 0.05) !important; } [data-theme="light"] .chapter-notice-classic { background: rgba(254, 243, 199, 0.75) !important; border-color: rgba(217, 119, 6, 0.24) !important; } [data-theme="light"] .chapter-notice-creator { background: rgba(224, 231, 255, 0.75) !important; border-color: rgba(79, 70, 229, 0.22) !important; } [data-theme="light"] .chapter-notice-tracking { background: rgba(219, 234, 254, 0.75) !important; border-color: rgba(37, 99, 235, 0.22) !important; } [data-theme="light"] .chapter-notice-text, [data-theme="light"] .chapter-notice-owner { color: #334155 !important; } [data-theme="light"] .chapter-notice-label { color: #1e3a8a !important; } [data-theme="light"] .chapters-filter-search { background: #e2e8f0 !important; border: 1px solid rgba(15, 23, 42, 0.14) !important; } [data-theme="light"] #chapterSearchInput { color: #0f172a !important; } [data-theme="light"] #chapterSearchInput::placeholder { color: #64748b !important; } [data-theme="light"] #chapterSortToggleBtn { background: #e2e8f0 !important; border: 1px solid rgba(15, 23, 42, 0.14) !important; color: #334155 !important; } [data-theme="light"] #chapterSortToggleBtn:hover { background: #d8e2ed !important; color: #0f172a !important; } /* Chapter row items */ [data-theme="light"] .ch-row-item { background: #e2e8f0 !important; border: 1px solid rgba(15, 23, 42, 0.08) !important; } [data-theme="light"] .ch-row-item:hover { background: #d8e2ed !important; border-color: rgba(79, 70, 229, 0.4) !important; box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06) !important; } [data-theme="light"] .ch-main-content, [data-theme="light"] .ch-title-row { color: #0f172a !important; } [data-theme="light"] .ch-title-text, [data-theme="light"] .ch-row-item .ch-title, [data-theme="light"] .ch-row-item a:not(.ch-btn-read) { color: #0f172a !important; } [data-theme="light"] .ch-title-text { font-weight: 700 !important; } [data-theme="light"] .ch-date, [data-theme="light"] .ch-date-text { color: #475569 !important; } [data-theme="light"] .ch-badge-num { background: #dbeafe !important; color: #1e3a8a !important; border: 1px solid rgba(37, 99, 235, 0.18) !important; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.4) !important; } [data-theme="light"] .ch-btn-read, [data-theme="light"] .ch-read-link { background: #4f46e5 !important; color: #ffffff !important; } [data-theme="light"] .ch-btn-read:hover, [data-theme="light"] .ch-read-link:hover { background: #4338ca !important; } [data-theme="light"] .tracked-chapter-link { background: #e2e8f0 !important; border: 1px solid rgba(15, 23, 42, 0.12) !important; color: #334155 !important; } [data-theme="light"] .tracked-chapter-link:hover { background: #dbe4ed !important; border-color: rgba(79, 70, 229, 0.3) !important; color: #312e81 !important; } [data-theme="light"] .chapters-empty-state { background: rgba(226, 232, 240, 0.65) !important; border-color: rgba(15, 23, 42, 0.14) !important; } [data-theme="light"] .chapters-empty-text { color: #475569 !important; } /* Similar Series Carousel Panel */ [data-theme="light"] .similar-series-panel { background: #edf2f7 !important; border: 1px solid rgba(15, 23, 42, 0.12) !important; box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08) !important; } [data-theme="light"] .similar-series-heading { color: #0f172a !important; } [data-theme="light"] .similar-series-arrow { background: transparent !important; border-color: #cbd5e1 !important; color: #475569 !important; box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08) !important; } [data-theme="light"] .similar-series-arrow:hover:not(:disabled) { background: rgba(79, 70, 229, 0.06) !important; border-color: rgba(79, 70, 229, 0.3) !important; color: #312e81 !important; } [data-theme="light"] .sim-card { background: #e2e8f0 !important; border: 1px solid rgba(15, 23, 42, 0.08) !important; box-shadow: 0 2px 6px rgba(15, 23, 42, 0.04) !important; } [data-theme="light"] .sim-card:hover { border-color: rgba(79, 70, 229, 0.4) !important; box-shadow: 0 6px 16px rgba(15, 23, 42, 0.10) !important; } [data-theme="light"] .sim-card-title { color: #0f172a !important; } [data-theme="light"] .sim-card-type, [data-theme="light"] .sim-card-meta { color: #475569 !important; } [data-theme="light"] .sim-card-img-wrap { background: #d0dbe6 !important; } /* ─── 7. USER PROFILE PAGE (`/profile/{id}`) ────────────────────────────── */ [data-theme="light"] .profile-wrapper::before, [data-theme="light"] .profile-wrapper::after { opacity: 0.08 !important; } [data-theme="light"] .profile-header { background: #edf2f7 !important; border: 1px solid rgba(15, 23, 42, 0.12) !important; box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08) !important; } [data-theme="light"] .profile-header-details h1 { color: #0f172a !important; } [data-theme="light"] .profile-header-details .profile-email { color: #475569 !important; } [data-theme="light"] .profile-header-details .profile-joined { color: #64748b !important; } [data-theme="light"] .profile-avatar { border: 2px solid rgba(79, 70, 229, 0.35) !important; box-shadow: 0 6px 18px rgba(15, 23, 42, 0.1) !important; background: #cbd5e1 !important; } [data-theme="light"] .stat-item { background: #e2e8f0 !important; border: 1px solid rgba(15, 23, 42, 0.08) !important; box-shadow: 0 2px 6px rgba(15, 23, 42, 0.04) !important; } [data-theme="light"] .stat-item:hover { border-color: rgba(79, 70, 229, 0.4) !important; box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08) !important; } [data-theme="light"] .stat-label { color: #64748b !important; } /* Tabs Bar */ [data-theme="light"] .tabs, [data-theme="light"] .profile-tabs { background: #edf2f7 !important; border: 1px solid rgba(15, 23, 42, 0.12) !important; box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06) !important; } [data-theme="light"] .tab-btn { color: #475569 !important; } [data-theme="light"] .tab-btn:hover { color: #0f172a !important; background: rgba(15, 23, 42, 0.06) !important; } [data-theme="light"] .tab-btn.active { color: #3730a3 !important; background: rgba(79, 70, 229, 0.14) !important; border-color: rgba(79, 70, 229, 0.35) !important; box-shadow: 0 2px 8px rgba(79, 70, 229, 0.15) !important; } [data-theme="light"] .tab-header-title { color: #0f172a !important; } /* Channel Cards in Profile */ [data-theme="light"] .channel-card-glass, [data-theme="light"] .channel-card { background: #edf2f7 !important; border: 1px solid rgba(15, 23, 42, 0.12) !important; box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06) !important; } [data-theme="light"] .channel-card-glass:hover, [data-theme="light"] .channel-card:hover { border-color: rgba(79, 70, 229, 0.45) !important; box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12), 0 0 16px rgba(79, 70, 229, 0.10) !important; } [data-theme="light"] .channel-card-glass h3, [data-theme="light"] .channel-card-glass .channel-name, [data-theme="light"] .channel-card h3 { color: #0f172a !important; } [data-theme="light"] .channel-card-glass p, [data-theme="light"] .channel-card-glass .channel-description, [data-theme="light"] .channel-card p { color: #475569 !important; } [data-theme="light"] .channel-avatar-squircle, [data-theme="light"] .channel-avatar { background: #cbd5e1 !important; border-color: rgba(79, 70, 229, 0.25) !important; box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08) !important; } /* Forms & Settings in Profile */ [data-theme="light"] .glass-form-container, [data-theme="light"] .glass-form-card, [data-theme="light"] .glass-card { background: #edf2f7 !important; border: 1px solid rgba(15, 23, 42, 0.12) !important; box-shadow: 0 6px 20px rgba(15, 23, 42, 0.06) !important; } [data-theme="light"] .glass-card-header { color: #0f172a !important; border-bottom: 1px solid rgba(15, 23, 42, 0.10) !important; } [data-theme="light"] .form-group label, [data-theme="light"] .glass-label { color: #334155 !important; } [data-theme="light"] .form-group input:not([type="checkbox"]):not([type="file"]):not([type="radio"]), [data-theme="light"] .form-group textarea, [data-theme="light"] .form-group select, [data-theme="light"] .glass-input { background: #e2e8f0 !important; border: 1px solid rgba(15, 23, 42, 0.15) !important; color: #0f172a !important; } [data-theme="light"] .form-group input:focus, [data-theme="light"] .form-group textarea:focus, [data-theme="light"] .form-group select:focus { border-color: #4f46e5 !important; box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.15) !important; background: #edf2f7 !important; } [data-theme="light"] .file-dropzone { background: #e2e8f0 !important; border: 2px dashed rgba(79, 70, 229, 0.35) !important; } [data-theme="light"] .btn-glass-secondary { background: #e2e8f0 !important; border: 1px solid rgba(15, 23, 42, 0.14) !important; color: #334155 !important; } [data-theme="light"] .btn-glass-secondary:hover { background: #d0dbe6 !important; color: #0f172a !important; } [data-theme="light"] .btn-logout { background: rgba(239, 68, 68, 0.10) !important; border: 1px solid rgba(239, 68, 68, 0.28) !important; color: #dc2626 !important; } [data-theme="light"] .btn-logout:hover { background: #dc2626 !important; color: #ffffff !important; } /* Profile upload and series editing */ [data-theme="light"] .profile-page-title, [data-theme="light"] .profile-header > h1, [data-theme="light"] .series-edit-title { color: #0f172a !important; } [data-theme="light"] .series-edit-page { background: #dbe4ed !important; color: #0f172a !important; } [data-theme="light"] .series-edit-form { background: #edf2f7 !important; border-color: rgba(15, 23, 42, 0.12) !important; box-shadow: 0 12px 32px rgba(15, 23, 42, 0.08) !important; backdrop-filter: none !important; } [data-theme="light"] .series-edit-form label, [data-theme="light"] .series-edit-form h3 { color: #334155 !important; } [data-theme="light"] .series-edit-form small, [data-theme="light"] .profile-channel-notice p, [data-theme="light"] .profile-empty-state-text, [data-theme="light"] #upload-series-form small, [data-theme="light"] #genre-no-results, [data-theme="light"] #genre-count-profile { color: #64748b !important; } [data-theme="light"] .series-edit-form input:not([type="checkbox"]):not([type="file"]), [data-theme="light"] .series-edit-form textarea, [data-theme="light"] .series-edit-form select { background: #e2e8f0 !important; border-color: rgba(15, 23, 42, 0.15) !important; color: #0f172a !important; box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04) !important; } [data-theme="light"] .series-edit-form input:focus, [data-theme="light"] .series-edit-form textarea:focus, [data-theme="light"] .series-edit-form select:focus { background: #edf2f7 !important; border-color: #4f46e5 !important; box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.14) !important; outline: none !important; } [data-theme="light"] .series-edit-form select option, [data-theme="light"] #upload-series-form select option { background: #edf2f7 !important; color: #0f172a !important; } [data-theme="light"] .series-cover-input, [data-theme="light"] #upload-series-form input[type="file"] { width: 100% !important; background: #e2e8f0 !important; border: 1px solid rgba(15, 23, 42, 0.15) !important; border-radius: 8px !important; color: #334155 !important; padding: 0.45rem !important; } [data-theme="light"] .series-cover-input::file-selector-button, [data-theme="light"] #upload-series-form input[type="file"]::file-selector-button { background: #4f46e5 !important; border: 0 !important; border-radius: 6px !important; color: #ffffff !important; cursor: pointer !important; font-weight: 700 !important; margin-right: 0.75rem !important; padding: 0.55rem 0.85rem !important; } [data-theme="light"] .series-edit-alert, [data-theme="light"] .profile-wrapper .alert-glass { background: #fee2e2 !important; border-color: rgba(220, 38, 38, 0.28) !important; color: #991b1b !important; backdrop-filter: none !important; } [data-theme="light"] .series-edit-alert h3, [data-theme="light"] .series-edit-alert ul, [data-theme="light"] .profile-wrapper .alert-glass strong, [data-theme="light"] .profile-wrapper .alert-glass ul { color: #991b1b !important; } [data-theme="light"] .series-edit-source-options .badge-btn { opacity: 0.82 !important; box-shadow: none !important; } [data-theme="light"] .series-edit-source-options .badge-btn:hover { opacity: 1 !important; } [data-theme="light"] .series-edit-genres, [data-theme="light"] #genre-container-profile { background: #e2e8f0 !important; border-color: rgba(15, 23, 42, 0.14) !important; } [data-theme="light"] .series-edit-genre-option, [data-theme="light"] .genre-label-profile { background: #edf2f7 !important; border: 1px solid rgba(15, 23, 42, 0.12) !important; color: #334155 !important; } [data-theme="light"] .series-edit-genre-option:hover, [data-theme="light"] .genre-label-profile:hover { background: #dbe4ed !important; border-color: rgba(79, 70, 229, 0.32) !important; color: #0f172a !important; } [data-theme="light"] .genre-label-profile:has(.genre-checkbox-profile:checked) { background: #e0e7ff !important; border-color: #6366f1 !important; color: #312e81 !important; box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.10) !important; } [data-theme="light"] .genre-checkbox-profile, [data-theme="light"] .series-edit-form .genre-checkbox { background: #edf2f7 !important; border-color: #94a3b8 !important; } [data-theme="light"] .genre-checkbox-profile:checked, [data-theme="light"] .series-edit-form .genre-checkbox:checked { background: #4f46e5 !important; border-color: #4f46e5 !important; } [data-theme="light"] #genre-badge-counter { background: #e0e7ff !important; border-color: rgba(79, 70, 229, 0.24) !important; color: #312e81 !important; } [data-theme="light"] .genre-add-button { background: #e0e7ff !important; border-color: rgba(79, 70, 229, 0.28) !important; color: #312e81 !important; } [data-theme="light"] .content-type-option { opacity: 0.78 !important; box-shadow: none !important; } [data-theme="light"] .content-type-option-official { background: rgba(16, 185, 129, 0.10) !important; border-color: rgba(16, 185, 129, 0.25) !important; color: #047857 !important; } [data-theme="light"] .content-type-option-translated { background: rgba(59, 130, 246, 0.10) !important; border-color: rgba(59, 130, 246, 0.25) !important; color: #1d4ed8 !important; } [data-theme="light"] .content-type-option-mtl { background: rgba(249, 115, 22, 0.10) !important; border-color: rgba(249, 115, 22, 0.25) !important; color: #c2410c !important; } [data-theme="light"] .content-type-option-raw { background: rgba(139, 92, 246, 0.10) !important; border-color: rgba(139, 92, 246, 0.25) !important; color: #6d28d9 !important; } [data-theme="light"] .content-type-option.is-selected { opacity: 1 !important; box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.12) !important; } [data-theme="light"] .upload-tracking-card, [data-theme="light"] .series-tracking-card { background: #e2e8f0 !important; border-color: rgba(15, 23, 42, 0.12) !important; } [data-theme="light"] .upload-tracking-card h3, [data-theme="light"] .series-tracking-card h3 { color: #0f172a !important; } [data-theme="light"] .upload-tracking-card > p, [data-theme="light"] .series-tracking-card > p { color: #475569 !important; } [data-theme="light"] .upload-author-box, [data-theme="light"] .series-author-notice { background: #fef3c7 !important; border-color: rgba(217, 119, 6, 0.28) !important; } [data-theme="light"] .upload-author-box span, [data-theme="light"] .series-author-notice span { color: #92400e !important; } [data-theme="light"] .upload-author-box p, [data-theme="light"] .series-author-notice p { color: #78350f !important; } [data-theme="light"] .upload-submit-wrap, [data-theme="light"] .series-edit-actions { border-top-color: rgba(15, 23, 42, 0.10) !important; } [data-theme="light"] .series-edit-submit { background: #2563eb !important; color: #ffffff !important; } [data-theme="light"] .series-edit-cancel { background: #e2e8f0 !important; border: 1px solid rgba(15, 23, 42, 0.14) !important; color: #334155 !important; } [data-theme="light"] .my-series-card { background: #edf2f7 !important; border-color: rgba(15, 23, 42, 0.12) !important; box-shadow: 0 8px 22px rgba(15, 23, 42, 0.08) !important; } [data-theme="light"] .my-series-card:hover { border-color: rgba(79, 70, 229, 0.38) !important; box-shadow: 0 14px 30px rgba(15, 23, 42, 0.12) !important; } [data-theme="light"] .my-series-card-body { background: #edf2f7 !important; } [data-theme="light"] .my-series-title { color: #0f172a !important; } [data-theme="light"] .my-series-type-badge { background: rgba(15, 23, 42, 0.78) !important; color: #ffffff !important; } [data-theme="light"] .my-series-studio-btn { background: rgba(16, 185, 129, 0.12) !important; border-color: rgba(16, 185, 129, 0.28) !important; color: #047857 !important; } [data-theme="light"] .my-series-edit-btn { background: rgba(59, 130, 246, 0.10) !important; border-color: rgba(59, 130, 246, 0.24) !important; color: #1d4ed8 !important; } [data-theme="light"] .my-series-promote-btn { background: rgba(245, 158, 11, 0.10) !important; border-color: rgba(245, 158, 11, 0.24) !important; color: #b45309 !important; } [data-theme="light"] .my-series-delete-btn { background: rgba(239, 68, 68, 0.10) !important; border-color: rgba(239, 68, 68, 0.24) !important; color: #b91c1c !important; } [data-theme="light"] .profile-channel-title, [data-theme="light"] .profile-channel-state-title { color: #0f172a !important; } [data-theme="light"] .profile-channel-description { color: #475569 !important; } [data-theme="light"] .profile-channel-count { background: #e0e7ff !important; border-color: rgba(79, 70, 229, 0.24) !important; color: #312e81 !important; } @media (max-width: 768px) { [data-theme="light"] .series-edit-shell { padding: 0 0.75rem !important; } [data-theme="light"] .series-edit-form { padding: 1.1rem !important; } .series-edit-form > div:first-of-type { grid-template-columns: 1fr !important; } } /* Theme-aware notification and confirmation dialogs */ [data-theme="light"] .or-modal-overlay { background: rgba(15, 23, 42, 0.42) !important; } [data-theme="light"] .or-modal-dialog { background: #edf2f7 !important; border-color: rgba(15, 23, 42, 0.12) !important; box-shadow: 0 24px 56px rgba(15, 23, 42, 0.22) !important; backdrop-filter: none !important; } [data-theme="light"] .or-modal-title { color: #0f172a !important; } [data-theme="light"] .or-modal-message { color: #475569 !important; } [data-theme="light"] .or-modal-cancel { background: #e2e8f0 !important; border-color: rgba(15, 23, 42, 0.14) !important; color: #334155 !important; } [data-theme="light"] .or-modal-confirm { color: #ffffff !important; } /* Groups */ [data-theme="light"] .groups-container .groups-header-banner, [data-theme="light"] .group-view-container .group-header { background: radial-gradient(circle at 50% 0%, rgba(99, 102, 241, 0.14) 0%, #edf2f7 85%) !important; border-color: rgba(79, 70, 229, 0.22) !important; box-shadow: 0 14px 32px rgba(15, 23, 42, 0.08) !important; backdrop-filter: none !important; } [data-theme="light"] .groups-container .groups-header-title, [data-theme="light"] .group-view-container .group-title { color: #0f172a !important; text-shadow: none !important; } [data-theme="light"] .groups-container .groups-header-subtitle, [data-theme="light"] .group-view-container .group-description, [data-theme="light"] .group-view-container .group-meta { color: #475569 !important; } [data-theme="light"] .groups-container .groups-header-badge, [data-theme="light"] .group-view-container .group-type-badge { background: #e0e7ff !important; border-color: rgba(79, 70, 229, 0.24) !important; color: #312e81 !important; } [data-theme="light"] .groups-container .filter-btn { background: #e2e8f0 !important; border-color: rgba(15, 23, 42, 0.12) !important; color: #475569 !important; backdrop-filter: none !important; } [data-theme="light"] .groups-container .filter-btn:hover { background: #dbe4ed !important; border-color: rgba(79, 70, 229, 0.3) !important; color: #312e81 !important; } [data-theme="light"] .groups-container .filter-btn.active { background: #4f46e5 !important; color: #ffffff !important; } [data-theme="light"] .groups-container .group-card, [data-theme="light"] .group-view-container .series-card { background: #edf2f7 !important; border: 1px solid rgba(15, 23, 42, 0.12) !important; box-shadow: 0 8px 22px rgba(15, 23, 42, 0.08) !important; backdrop-filter: none !important; } [data-theme="light"] .groups-container .gc-cover, [data-theme="light"] .groups-container .gc-cover-placeholder { background: #d0dbe6 !important; border-color: rgba(15, 23, 42, 0.10) !important; } [data-theme="light"] .groups-container .group-title, [data-theme="light"] .group-view-container .series-title { color: #0f172a !important; } [data-theme="light"] .groups-container .group-description, [data-theme="light"] .groups-container .group-stats, [data-theme="light"] .groups-container .group-creator, [data-theme="light"] .group-view-container .series-meta, [data-theme="light"] .group-view-container .empty-state { color: #475569 !important; } [data-theme="light"] .groups-container .group-card-footer { border-top-color: rgba(15, 23, 42, 0.10) !important; } [data-theme="light"] .groups-container .group-creator strong { color: #3730a3 !important; } [data-theme="light"] .groups-container .group-series-pill, [data-theme="light"] .groups-container .group-auto-badge { background: #e2e8f0 !important; border-color: rgba(15, 23, 42, 0.12) !important; color: #334155 !important; } [data-theme="light"] .groups-container .group-type-badge { color: #3730a3 !important; } [data-theme="light"] .groups-container .type-manga { color: #6d28d9 !important; } [data-theme="light"] .groups-container .type-manhwa { color: #0369a1 !important; } [data-theme="light"] .groups-container .type-anime { color: #4338ca !important; } [data-theme="light"] .groups-container .type-novel, [data-theme="light"] .groups-container .type-light-novel, [data-theme="light"] .groups-container .type-web-novel { color: #047857 !important; } [data-theme="light"] .groups-container .empty-groups-state { background: #edf2f7 !important; border-color: rgba(79, 70, 229, 0.24) !important; backdrop-filter: none !important; } [data-theme="light"] .groups-container .empty-groups-state h2 { color: #0f172a !important; } [data-theme="light"] .groups-container .empty-groups-state p { color: #475569 !important; } [data-theme="light"] #createGroupModal .modal-content, [data-theme="light"] .group-view-container .modal-content { background: #edf2f7 !important; border-color: rgba(15, 23, 42, 0.12) !important; box-shadow: 0 24px 56px rgba(15, 23, 42, 0.2) !important; } [data-theme="light"] #createGroupModal .modal-header h2, [data-theme="light"] .group-view-container .modal-header h2 { color: #0f172a !important; } [data-theme="light"] #createGroupModal .modal-close, [data-theme="light"] .group-view-container .modal-close { color: #475569 !important; } [data-theme="light"] #createGroupModal .info-box p { color: #334155 !important; } [data-theme="light"] #createGroupModal .form-group label { color: #334155 !important; } [data-theme="light"] #createGroupModal .form-group input:not([type="checkbox"]), [data-theme="light"] #createGroupModal .form-group textarea, [data-theme="light"] #createGroupModal .form-group select, [data-theme="light"] .group-view-container .search-box input { background: #e2e8f0 !important; border-color: #cbd5e1 !important; color: #0f172a !important; } [data-theme="light"] #createGroupModal .btn-cancel { background: #e2e8f0 !important; border-color: rgba(15, 23, 42, 0.14) !important; color: #334155 !important; } [data-theme="light"] .group-view-container .series-item { background: #e2e8f0 !important; border-color: #cbd5e1 !important; } [data-theme="light"] .group-edit-page .group-edit-title { color: #0f172a !important; } [data-theme="light"] .group-edit-page .group-edit-card { background: #edf2f7 !important; border-color: rgba(15, 23, 42, 0.12) !important; box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08) !important; } [data-theme="light"] .group-edit-page label { color: #334155 !important; } [data-theme="light"] .group-edit-page input, [data-theme="light"] .group-edit-page textarea { background: #e2e8f0 !important; border-color: #cbd5e1 !important; color: #0f172a !important; } [data-theme="light"] .group-edit-page .group-edit-cancel { background: #e2e8f0 !important; color: #334155 !important; } /* Author Studio */ [data-theme="light"] .author-studio-page-title, [data-theme="light"] .author-studio-series-heading, [data-theme="light"] .author-studio-chapter-editor > h1 { color: #0f172a !important; } [data-theme="light"] .author-studio-page-subtitle, [data-theme="light"] .author-studio-author, [data-theme="light"] .author-studio-empty-copy, [data-theme="light"] .author-studio-breadcrumb, [data-theme="light"] .author-studio-breadcrumb-current, [data-theme="light"] .author-studio-chapter-meta, [data-theme="light"] .author-studio-empty-chapters { color: #475569 !important; } [data-theme="light"] .author-studio-card, [data-theme="light"] .author-studio-empty, [data-theme="light"] .author-studio-chapter-panel, [data-theme="light"] .author-studio-chapter-form { background: #edf2f7 !important; border-color: rgba(15, 23, 42, 0.12) !important; box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08) !important; backdrop-filter: none !important; } [data-theme="light"] .author-studio-poster, [data-theme="light"] .author-studio-series-cover { background: #d0dbe6 !important; border-color: rgba(15, 23, 42, 0.12) !important; box-shadow: 0 4px 10px rgba(15, 23, 42, 0.08) !important; } [data-theme="light"] .author-studio-title, [data-theme="light"] .author-studio-title-link, [data-theme="light"] .author-studio-empty-title, [data-theme="light"] .author-studio-author-name, [data-theme="light"] .author-studio-chapter-panel-header h2, [data-theme="light"] .author-studio-chapter-title { color: #0f172a !important; } [data-theme="light"] .author-studio-actions, [data-theme="light"] .author-studio-chapter-panel-header { background: #e2e8f0 !important; border-color: rgba(15, 23, 42, 0.10) !important; } [data-theme="light"] .author-studio-chapter-row { border-bottom-color: rgba(15, 23, 42, 0.08) !important; } [data-theme="light"] .author-studio-chapter-row:hover { background: rgba(79, 70, 229, 0.05) !important; } [data-theme="light"] .btn-studio-manage, [data-theme="light"] .author-studio-secondary-link, [data-theme="light"] .author-studio-public-link { background: #e0e7ff !important; border-color: rgba(79, 70, 229, 0.24) !important; color: #312e81 !important; } [data-theme="light"] .author-studio-alert-success, [data-theme="light"] .author-studio-published-badge { background: #d1fae5 !important; border-color: rgba(5, 150, 105, 0.24) !important; color: #047857 !important; } [data-theme="light"] .author-studio-type-badge { background: #e0e7ff !important; border-color: rgba(79, 70, 229, 0.24) !important; color: #312e81 !important; } [data-theme="light"] .author-studio-chapter-form label { color: #334155 !important; } [data-theme="light"] .author-studio-chapter-form input:not([type="file"]), [data-theme="light"] .author-studio-chapter-form select, [data-theme="light"] .author-studio-chapter-form textarea { background: #e2e8f0 !important; border-color: #cbd5e1 !important; color: #0f172a !important; } [data-theme="light"] .author-studio-chapter-form #wordCountBadge { background: transparent !important; color: #475569 !important; } [data-theme="light"] .author-studio-chapter-form #imageDropzone { background: #e2e8f0 !important; border-color: rgba(79, 70, 229, 0.32) !important; } [data-theme="light"] .author-studio-chapter-form #imageDropzone p:first-of-type { color: #334155 !important; } [data-theme="light"] .author-studio-chapter-form #imageDropzone p:last-of-type { color: #64748b !important; } [data-theme="light"] .author-studio-form-actions { border-top-color: rgba(15, 23, 42, 0.10) !important; } [data-theme="light"] .author-studio-draft-btn { background: #e2e8f0 !important; border-color: rgba(15, 23, 42, 0.14) !important; color: #334155 !important; } [data-theme="light"] .chapter-upload-preview { background: #edf2f7 !important; border-color: rgba(15, 23, 42, 0.12) !important; } [data-theme="light"] .chapter-upload-preview-zip { background: #e0e7ff !important; color: #4338ca !important; } [data-theme="light"] .chapter-upload-preview-name { background: #e2e8f0 !important; color: #475569 !important; } /* Feed skeletons and loading placeholders */ [data-theme="light"] .skeleton-card { background: #edf2f7 !important; border-color: rgba(15, 23, 42, 0.10) !important; box-shadow: 0 6px 16px rgba(15, 23, 42, 0.05) !important; } [data-theme="light"] .skeleton-cover, [data-theme="light"] .skeleton-line, [data-theme="light"] .skeleton-slide { background: #cbd7e3 !important; } [data-theme="light"] .skeleton-cover::after, [data-theme="light"] .skeleton-line::after, [data-theme="light"] .skeleton-slide::after { background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.55) 50%, transparent 100%) !important; } [data-theme="light"] .notification-spinner { border-color: rgba(79, 70, 229, 0.18) !important; border-top-color: #4f46e5 !important; } /* ─── 8. BROWSE & FILTER BARS (`/manhwa`, `/anime`, `/novel`, etc.) ───────── */ [data-theme="light"] .filter-bar { background: #edf2f7 !important; border: 1px solid rgba(15, 23, 42, 0.12) !important; box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06) !important; } [data-theme="light"] .cs-trigger { background: #e2e8f0 !important; border: 1px solid rgba(15, 23, 42, 0.14) !important; color: #0f172a !important; } [data-theme="light"] .cs-trigger:hover { border-color: rgba(79, 70, 229, 0.5) !important; background: #edf2f7 !important; box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.10) !important; } [data-theme="light"] .cs-trigger-arrow { color: #4f46e5 !important; } [data-theme="light"] .cs-dropdown { background: #edf2f7 !important; border: 1px solid rgba(79, 70, 229, 0.25) !important; box-shadow: 0 10px 30px rgba(15, 23, 42, 0.14) !important; } [data-theme="light"] .cs-option { color: #334155 !important; border-bottom: 1px solid rgba(15, 23, 42, 0.06) !important; } [data-theme="light"] .cs-option:hover { background: rgba(79, 70, 229, 0.08) !important; color: #0f172a !important; } [data-theme="light"] .cs-option.cs-selected { background: rgba(79, 70, 229, 0.14) !important; color: #3730a3 !important; } [data-theme="light"] .page-btn { background: #e2e8f0 !important; border: 1px solid rgba(15, 23, 42, 0.12) !important; color: #334155 !important; } [data-theme="light"] .page-btn:hover, [data-theme="light"] .page-btn.active { background: #4f46e5 !important; border-color: #4f46e5 !important; color: #ffffff !important; } /* ─── 9. FOOTER ─────────────────────────────────────────────────────────── */ [data-theme="light"] .site-footer { background: #cfd9e5 !important; border-top: 1px solid rgba(15, 23, 42, 0.10) !important; } [data-theme="light"] .site-footer-logo-text { color: #0f172a !important; } [data-theme="light"] .site-footer-tagline { color: #475569 !important; } [data-theme="light"] .site-footer-badge { background: #dbe4ed !important; border: 1px solid rgba(15, 23, 42, 0.12) !important; color: #334155 !important; } [data-theme="light"] .site-footer-social a, [data-theme="light"] .site-footer-social-btn { background: #dbe4ed !important; border: 1px solid rgba(15, 23, 42, 0.12) !important; color: #475569 !important; } [data-theme="light"] .site-footer-social a:hover, [data-theme="light"] .site-footer-social-btn:hover { background: rgba(79, 70, 229, 0.14) !important; border-color: rgba(79, 70, 229, 0.35) !important; color: #0f172a !important; } [data-theme="light"] .site-footer-col h3, [data-theme="light"] .site-footer-col h4 { color: #0f172a !important; } [data-theme="light"] .site-footer-col a, [data-theme="light"] .site-footer-link { color: #475569 !important; } [data-theme="light"] .site-footer-col a:hover, [data-theme="light"] .site-footer-link:hover { color: #0f172a !important; } [data-theme="light"] .site-footer-bottom { background: rgba(0, 0, 0, 0.04) !important; border-top: 1px solid rgba(15, 23, 42, 0.08) !important; } [data-theme="light"] .site-footer-bottom p, [data-theme="light"] .site-footer-bottom .copy { color: #64748b !important; } /* ─── 10. NOTIFICATION BELL & DROPDOWNS ──────────────────────────────────── */ [data-theme="light"] .notification-bell-btn { background: rgba(255, 255, 255, 0.75) !important; border-color: rgba(15, 23, 42, 0.12) !important; color: #334155 !important; box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06) !important; } [data-theme="light"] .notification-bell-btn:hover { background: rgba(79, 70, 229, 0.08) !important; border-color: rgba(79, 70, 229, 0.35) !important; color: #3730a3 !important; } [data-theme="light"] .notification-dropdown { background: #edf2f7 !important; border: 1px solid rgba(15, 23, 42, 0.12) !important; box-shadow: 0 10px 30px rgba(15, 23, 42, 0.14) !important; } [data-theme="light"] .notification-header { background: rgba(255, 255, 255, 0.45) !important; border-bottom-color: rgba(15, 23, 42, 0.08) !important; } [data-theme="light"] .notification-title { color: #0f172a !important; } [data-theme="light"] .notification-unread-pill { background: rgba(79, 70, 229, 0.12) !important; color: #3730a3 !important; border-color: rgba(79, 70, 229, 0.25) !important; } [data-theme="light"] .mark-all-read-btn { background: rgba(255, 255, 255, 0.75) !important; border-color: rgba(15, 23, 42, 0.12) !important; color: #475569 !important; } [data-theme="light"] .mark-all-read-btn:hover { background: #4f46e5 !important; border-color: #4f46e5 !important; color: #ffffff !important; box-shadow: 0 0 12px rgba(79, 70, 229, 0.25) !important; } [data-theme="light"] .push-optin-bar { background: linear-gradient(90deg, rgba(79, 70, 229, 0.08), rgba(139, 92, 246, 0.06)) !important; border-bottom-color: rgba(15, 23, 42, 0.08) !important; color: #475569 !important; } [data-theme="light"] .push-optin-text { color: #334155 !important; } [data-theme="light"] .push-toggle-btn { box-shadow: 0 2px 8px rgba(79, 70, 229, 0.2) !important; } [data-theme="light"] .notification-list::-webkit-scrollbar-thumb { background: rgba(15, 23, 42, 0.18) !important; } [data-theme="light"] .notification-item { border-color: rgba(15, 23, 42, 0.06) !important; color: #334155 !important; } [data-theme="light"] .notification-item:hover { background: rgba(79, 70, 229, 0.06) !important; } [data-theme="light"] .notification-item.unread { background: linear-gradient(90deg, rgba(79, 70, 229, 0.10) 0%, rgba(79, 70, 229, 0.03) 100%) !important; } [data-theme="light"] .notification-thumb-box { background: #dbe4ed !important; border-color: rgba(15, 23, 42, 0.1) !important; box-shadow: 0 4px 10px rgba(15, 23, 42, 0.08) !important; } [data-theme="light"] .notification-series-title { color: #0f172a !important; } [data-theme="light"] .notification-chapter-pill { background: rgba(79, 70, 229, 0.12) !important; color: #3730a3 !important; border-color: rgba(79, 70, 229, 0.22) !important; } [data-theme="light"] .notification-msg, [data-theme="light"] .notification-time, [data-theme="light"] .quick-mark-btn, [data-theme="light"] .notification-empty, [data-theme="light"] .notification-empty p { color: #64748b !important; } [data-theme="light"] .quick-mark-btn:hover { color: #059669 !important; background: rgba(16, 185, 129, 0.12) !important; } [data-theme="light"] .notification-empty h4 { color: #0f172a !important; } [data-theme="light"] .notification-footer { background: rgba(255, 255, 255, 0.45) !important; border-top-color: rgba(15, 23, 42, 0.08) !important; } [data-theme="light"] .view-all-link { color: #4338ca !important; } [data-theme="light"] .view-all-link:hover { color: #312e81 !important; } /* ─── 11. SKELETONS & EMPTY STATES ───────────────────────────────────────── */ [data-theme="light"] .skeleton { background: linear-gradient(90deg, #d0dbe6 25%, #dbe4ed 50%, #d0dbe6 75%) !important; background-size: 200% 100% !important; } [data-theme="light"] .empty-state, [data-theme="light"] .no-series, [data-theme="light"] .loading { color: #64748b !important; }