/* BLACK LOTUS NOVEL - NARROWER SITE WIDTH */ .site { max-width: 1000px; margin-left: auto; margin-right: auto; } .site-content { padding-left: 20px; padding-right: 20px; } @media (max-width: 600px) { .site { max-width: 100%; } .site-content { padding-left: 15px; padding-right: 15px; } } /* ========================================================= BLACK LOTUS NOVEL CHAPTER / POST WIDTH ========================================================= */ .single-post .site-content { display: flex; justify-content: center; } .single-post .site-main { width: 100%; max-width: 850px; margin-left: auto; margin-right: auto; } /* Mobile */ @media (max-width: 600px) { .single-post .site-content { display: block; } .single-post .site-main { max-width: 100%; } } /* ======================================================== BLACK LOTUS NOVEL - CARD & TITLE STYLE ======================================================== */ /* ======================================================== 1. NEW SERIES + COMPLETED SERIES CARD ======================================================== */ .blacklotus-home-continue-card { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-width: 0; box-sizing: border-box; padding: 14px 15px; border: 1px solid #dddddd; border-radius: 8px; background: #ffffff; color: #2b2b2b; box-shadow: 0 2px 10px rgba( 0, 0, 0, 0.06 ); } /* ======================================================== DARK MODE ======================================================== */ body:not(.blacklotus-light-reader) .blacklotus-home-continue-card { background: #333333; border-color: #555555; color: #ffffff; } /* ======================================================== DARK MODE - NOVEL TITLE ======================================================== */ body:not(.blacklotus-light-reader) .blacklotus-home-continue-title { color: #ffffff !important; } /* ======================================================== LIGHT MODE ======================================================== */ body.blacklotus-light-reader .blacklotus-home-continue-card { background: #ffffff; border-color: #dddddd; color: #2b2b2b; } body.blacklotus-light-reader .blacklotus-home-continue-title { color: #2b2b2b !important; } /* ======================================================== 2. NEW + COMPLETED TITLE MAXIMUM 2 LINES ======================================================== */ .blacklotus-home-title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; white-space: normal; } /* ======================================================== 3. RECENTLY UPDATED TITLE MAXIMUM 2 LINES ======================================================== */ .blacklotus-recent-title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; white-space: normal; } /* ======================================================== 4. RECOMMENDATION TITLE MAXIMUM 2 LINES ======================================================== */ .blacklotus-recommendation-title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis; white-space: normal; } /* ======================================================== ALL FEATURED IMAGES - ROUNDED CORNERS ======================================================== */ .blacklotus-home-cover, .blacklotus-home-cover img, .blacklotus-recent-image, .blacklotus-recent-image img, .blacklotus-series-image-wrapper, .blacklotus-series-image-wrapper img { border-radius: 8px; } /* ============================================================ BLACK LOTUS NOVEL - HEADER FINAL ============================================================ */ @media (min-width: 769px) { /* HEADER */ .inside-header { display: flex !important; align-items: center !important; position: relative !important; } /* ======================================================== LOGO / SITE TITLE ======================================================== */ .site-branding { flex: 0 0 auto !important; position: relative !important; z-index: 10 !important; /* Geser BLACK LOTUS NOVEL ke kanan */ margin-left: 120px !important; } /* ======================================================== MAIN NAVIGATION ======================================================== */ #site-navigation { flex: 1 1 auto !important; min-width: 0 !important; margin-left: 0 !important; } #site-navigation > .inside-navigation { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; overflow: hidden !important; } /* ======================================================== ALL SERIES + MY LIBRARY ======================================================== */ #primary-menu { flex: 0 1 auto !important; min-width: 0 !important; } #primary-menu > ul { display: flex !important; align-items: center !important; justify-content: center !important; flex-wrap: nowrap !important; margin: 0 !important; padding: 0 !important; max-width: 100% !important; } #primary-menu > ul > li { position: static !important; left: auto !important; transform: none !important; flex-shrink: 0 !important; } /* ======================================================== SEARCH ======================================================== */ #site-navigation > .inside-navigation > .menu-bar-items { flex: 0 0 auto !important; margin-left: 200px !important; transform: translateX(20px) !important; } /* ============================================================ MOBILE ============================================================ */ @media (max-width: 768px) { .site-branding { margin-left: 0 !important; } #primary-menu > ul > li { position: static !important; left: auto !important; transform: none !important; } } /* ======================================================== BLACK LOTUS NOVEL - MY LIBRARY FEATURED IMAGE ROUNDED CORNERS ======================================================== */ .blacklotus-library-bookmark-cover, .blacklotus-library-bookmark-cover img { border-radius: 8px !important; } /* ======================================================== BLACK LOTUS NOVEL - MY LIBRARY FEATURED IMAGE ROUNDED CORNERS ======================================================== */ .blacklotus-library-bookmark-cover { position: relative; border-radius: 8px !important; overflow: hidden !important; } .blacklotus-library-bookmark-cover img { display: block; width: 100%; border-radius: 8px !important; } /* ============================================================ BLACK LOTUS MY LIBRARY FORCE LIGHT MODE TAB TEXT COLOR ============================================================ */ body.blacklotus-light-reader #blacklotus-my-library-v2 .blacklotus-library-v2-tabs .blacklotus-library-v2-tab, body.blacklotus-light-reader #blacklotus-my-library-v2 .blacklotus-library-v2-tabs .blacklotus-library-v2-tab:hover, body.blacklotus-light-reader #blacklotus-my-library-v2 .blacklotus-library-v2-tabs .blacklotus-library-v2-tab:focus, body.blacklotus-light-reader #blacklotus-my-library-v2 .blacklotus-library-v2-tabs .blacklotus-library-v2-tab:focus-visible, body.blacklotus-light-reader #blacklotus-my-library-v2 .blacklotus-library-v2-tabs .blacklotus-library-v2-tab:active, body.blacklotus-light-reader #blacklotus-my-library-v2 .blacklotus-library-v2-tabs .blacklotus-library-v2-tab.active, body.blacklotus-light-reader #blacklotus-my-library-v2 .blacklotus-library-v2-tabs .blacklotus-library-v2-tab.active:hover, body.blacklotus-light-reader #blacklotus-my-library-v2 .blacklotus-library-v2-tabs .blacklotus-library-v2-tab.active:focus, body.blacklotus-light-reader #blacklotus-my-library-v2 .blacklotus-library-v2-tabs .blacklotus-library-v2-tab.active:active, body.blacklotus-light-reader #blacklotus-my-library-v2 .blacklotus-library-v2-tabs .blacklotus-library-v2-tab *, body.blacklotus-light-reader #blacklotus-my-library-v2 .blacklotus-library-v2-tabs .blacklotus-library-v2-tab:hover *, body.blacklotus-light-reader #blacklotus-my-library-v2 .blacklotus-library-v2-tabs .blacklotus-library-v2-tab:focus *, body.blacklotus-light-reader #blacklotus-my-library-v2 .blacklotus-library-v2-tabs .blacklotus-library-v2-tab:active * { color: #111111 !important; } /* Active underline */ body.blacklotus-light-reader #blacklotus-my-library-v2 .blacklotus-library-v2-tab.active::after { background: #333333 !important; } /* Remove theme button styling */ body.blacklotus-light-reader #blacklotus-my-library-v2 .blacklotus-library-v2-tab { background: transparent !important; text-shadow: none !important; } /* Prevent theme from changing text on hover */ body.blacklotus-light-reader #blacklotus-my-library-v2 .blacklotus-library-v2-tab:hover { background: transparent !important; color: #111111 !important; } /* Prevent theme from changing text after click */ body.blacklotus-light-reader #blacklotus-my-library-v2 .blacklotus-library-v2-tab:active { background: transparent !important; color: #111111 !important; } /* Prevent focus styling */ body.blacklotus-light-reader #blacklotus-my-library-v2 .blacklotus-library-v2-tab:focus, body.blacklotus-light-reader #blacklotus-my-library-v2 .blacklotus-library-v2-tab:focus-visible { background: transparent !important; color: #111111 !important; outline: none !important; box-shadow: none !important; } /* BLACK LOTUS NOVEL - FOOTER LINKS */ .footer-widget-1 .widget_block p { font-size: 11px !important; line-height: 1.5 !important; } .footer-widget-1 .widget_block p a { font-size: 11px !important; } /* BLACK LOTUS NOVEL - COPYRIGHT */ .copyright-bar { font-size: 11px !important; line-height: 1.5 !important; } /* ============================================================ BLACK LOTUS NOVEL FULL HEIGHT PAGE / FOOTER AT BOTTOM ============================================================ */ html, body { min-height: 100%; } body { min-height: 100vh; } #page { min-height: 70vh; display: flex; flex-direction: column; } #content { flex: 1 0 auto; } .site-footer { margin-top: auto; } /* ============================================================ BLACK LOTUS NOVEL SEARCH MODAL - LIGHT MODE FRAME ============================================================ */ body.blacklotus-light-reader .gp-modal__container .search-modal-fields { display: flex !important; width: 100% !important; box-sizing: border-box !important; border: 1px solid #cccccc !important; border-radius: 6px !important; overflow: hidden !important; background: #ffffff !important; padding: 0 !important; box-shadow: none !important; } /* ============================================================ SEARCH INPUT ============================================================ */ body.blacklotus-light-reader .gp-modal__container .search-modal-fields .search-field { flex: 1 1 auto !important; min-width: 0 !important; border: none !important; border-radius: 0 !important; outline: none !important; box-shadow: none !important; background: transparent !important; } /* ============================================================ SEARCH BUTTON ============================================================ */ body.blacklotus-light-reader .gp-modal__container .search-modal-fields button { flex: 0 0 auto !important; border: none !important; border-radius: 0 !important; outline: none !important; box-shadow: none !important; background: transparent !important; } /* ============================================================ FOCUS ============================================================ */ body.blacklotus-light-reader .gp-modal__container .search-modal-fields:focus-within { border-color: #999999 !important; }