/* ===================================================================== Lop giao dien sang / toi cho toan site (PC + mobile) Cach hoat dong -------------- Mot doan script chan trong gan `data-theme="light|dark"` len the TRUOC khi trang ve khung hinh dau tien. Uu tien: lua chon nguoi dung da luu trong localStorage, khong co thi theo he dieu hanh. Vi sao lam o phia trinh duyet chu khong phai phia may chu --------------------------------------------------------- app/middleware/PageCache.php cache nguyen trang 600 giay cho khach chua dang nhap, key chi gom host|path|query. Neu render theme o server thi mot nguoi dung theme toi se "dong bang" ban HTML toi do vao cache va phuc vu cho tat ca khach con lai. Vi vay theme khong duoc phep lam thay doi HTML. Doi lai: khong dung them key cache nao, khong dung them query nao, khong anh huong SEO (noi dung va the meta khong doi mot ky tu). File nay duoc sinh mot phan --------------------------- Khoi "sinh tu style.css / mstyle.css" o duoi la ban do mau tu dong: doc hai file CSS goc, tim moi khai bao dat mau sang, gom cac selector cung mau dich vao mot rule. Sua tay duoc binh thuong. Muon sinh lai sau khi style.css doi nhieu thi chay lai script gen_dark.py (xem ghi chu cuoi file). Moi mau di qua bien --dk-*. Doi bang mau chi can sua khoi bien ben duoi. ===================================================================== */ html[data-theme="dark"] { --dk-bg: #0f1115; /* nen trang */ --dk-surface: #171a20; /* the, khoi noi dung (truoc la #fff) */ --dk-surface-2: #1e222a; /* nen phu (truoc la #f6-#f8) */ --dk-surface-3: #272c35; /* nen nhan manh (truoc la #ededed) */ --dk-line: #333945; /* duong vien (truoc la #d9d9d9) */ --dk-text: #e8eaef; /* chu chinh (truoc la #252525) */ --dk-text-2: #a8b0bb; /* chu phu (truoc la #666) */ --dk-text-3: #8b939f; /* chu mo (truoc la #999) */ --dk-accent-dim: #2b1a20; /* nen hong nhat (truoc la #ffeef1) */ /* Bao trinh duyet ve thanh cuon, o input, dropdown theo he mau toi. Khong co dong nay thi form va scrollbar van trang toat. */ color-scheme: dark; } /* ---------------------------------------------------------------- NEN GOC */ html[data-theme="dark"], html[data-theme="dark"] body { background-color: var(--dk-bg); color: var(--dk-text); } /* ------------------------------------------------------------------ PC - sinh tu style.css ------------------------------------------------------------------ */ html[data-theme="dark"] .full-class li a, html[data-theme="dark"] .full-class-btn, html[data-theme="dark"] .index-title h2, html[data-theme="dark"] .index-title-select li a, html[data-theme="dark"] .index-title-more, html[data-theme="dark"] .index-original-list li .info .title, html[data-theme="dark"] .index-original-list li .info .title a, html[data-theme="dark"] .index-original-list li .info .subtitle span.label, html[data-theme="dark"] .index-rank-title, html[data-theme="dark"] .index-rank-title .more, html[data-theme="dark"] .index-rank-list li .info .title, html[data-theme="dark"] .index-rank-list li .info .title a, html[data-theme="dark"] .index-manga-list li .title, html[data-theme="dark"] .index-manga-list li .new, html[data-theme="dark"] .index-manga-detail .detail .title span, html[data-theme="dark"] .index-manga-detail .detail .new, html[data-theme="dark"] body.white .view-comment-main .top span, html[data-theme="dark"] body.white .view-comment-main .list li .info .title, html[data-theme="dark"] .view-comment .index-title h2, html[data-theme="dark"] .view-comment .detail-list-title .block, html[data-theme="dark"] .view-comment .detail-list-title .s, html[data-theme="dark"] .view-comment .view-win-list li a, html[data-theme="dark"] .view-comment .view-comment-sub .avatar-bar .title, html[data-theme="dark"] .view-comment .view-comment-sub .avatar-bar .subtitle, html[data-theme="dark"] .view-comment .view-comment-sub .avatar-bar .tip, html[data-theme="dark"] .view-comment .view-comment-sub .sub-bar .title, html[data-theme="dark"] .view-comment .view-comment-sub .sub-bar .title .more, html[data-theme="dark"] .view-comment .view-comment-sub .sub-bar .slide .subtitle, html[data-theme="dark"] .view-comment .view-comment-sub .sub-manga .top, html[data-theme="dark"] .view-comment .view-comment-sub .sub-manga .list li .info .title, html[data-theme="dark"] .view-comment .view-comment-sub .sub-manga .list li .info .title a, html[data-theme="dark"] .view-comment .view-comment-sub .sub-manga .list li .info .subtitle, html[data-theme="dark"] .view-comment .view-comment-sub .sub-manga .list li .info .subtitle a, html[data-theme="dark"] .view-comment .view-comment-sub .sub-manga .list li .title, html[data-theme="dark"] .view-comment .view-detail-list li .info .title, html[data-theme="dark"] .view-comment .warning-bar a, html[data-theme="dark"] .view-comment .left-bar .top .info .title, html[data-theme="dark"] .view-comment .left-bar .list li .title, html[data-theme="dark"] .index-booklist-list li .title a, html[data-theme="dark"] .index-rank-bar .left-list li a, html[data-theme="dark"] .index-rank-bar .right-list li a, html[data-theme="dark"] .dk_toggle, html[data-theme="dark"] .dk_options_inner, html[data-theme="dark"] .table-head .table-tabs li a, html[data-theme="dark"] .box404, html[data-theme="dark"] .about-page h2, html[data-theme="dark"] .about-page .linkman-list li p span, html[data-theme="dark"] .about-page .forms .tabs li a, html[data-theme="dark"] .modal-wrap .modal .modal-body.vip-modal h2, html[data-theme="dark"] .modal-wrap .modal .modal-body.vip-modal .desc, html[data-theme="dark"] .modal-wrap .modal .modal-body.login-modal h1, html[data-theme="dark"] .modal-wrap .modal .modal-body.paydetail-modal h1, html[data-theme="dark"] .modal-wrap .modal .modal-body.paydetail-modal>div .logs table th, html[data-theme="dark"] .down-app-page .banner-top .wrap .right .txt, html[data-theme="dark"] .down-app-page .banner-top .wrap .right .donws p, html[data-theme="dark"] .down-app-page .banner-top .wrap .right .down-btn a, html[data-theme="dark"] .down-app-page .banner-box h1, html[data-theme="dark"] .down-app-page .banner-bottom .links span a, html[data-theme="dark"] .scan-pay-box .order-info p, html[data-theme="dark"] .scan-pay-box .goods-info, html[data-theme="dark"] .box .box-header .cat-tabs li a, html[data-theme="dark"] .box .box-header .more, html[data-theme="dark"] .box .box-body .more, html[data-theme="dark"] .box-simple-tabs li a, html[data-theme="dark"] .header-title li a, html[data-theme="dark"] .header-search-list ul li a.type_1, html[data-theme="dark"] .header-search-list ul li .type_2 .info .title a, html[data-theme="dark"] .hover .hover-list .block .title, html[data-theme="dark"] .hover .hover-list .block .login-title, html[data-theme="dark"] .hover .hover-list .block ul li .info .title a, html[data-theme="dark"] .booklist-aside dt, html[data-theme="dark"] .brand-head .head-wrap .head .info .title, html[data-theme="dark"] .cat-filter .cat-list dd, html[data-theme="dark"] .cat-filter .field-list dd, html[data-theme="dark"] .dateProgressBar .bar-wrap .data-list li span.day, html[data-theme="dark"] .topFIxedMenu>div .top-menu li a, html[data-theme="dark"] .user-sidebar .user-info h1, html[data-theme="dark"] .user-sidebar .user-info p, html[data-theme="dark"] .user-sidebar .user-menu li a, html[data-theme="dark"] .user-sidebar .user-menu li a i, html[data-theme="dark"] .banner_detail_form .info h1, html[data-theme="dark"] .banner_detail_form .info .title .right .score, html[data-theme="dark"] .sub-title, html[data-theme="dark"] .banner_detail_form .info .tip .block a, html[data-theme="dark"] .banner_detail_form .info .tip .ticai a, html[data-theme="dark"] .banner_detail_form .info .bottom .btn-3 .code p, html[data-theme="dark"] .banner_waterwheel .next-btn, html[data-theme="dark"] .banner_waterwheel .prev-btn, html[data-theme="dark"] .account-box .head, html[data-theme="dark"] .account-box .qr-wrap>div .title, html[data-theme="dark"] .booklist .title a, html[data-theme="dark"] .booklist .desc, html[data-theme="dark"] .box-con-5n1 .detail-tabs-container .detail-tabs-pane .detail .title a, html[data-theme="dark"] .box-con-5n1 .detail-tabs-container .detail-tabs-pane .detail .info .new, html[data-theme="dark"] .box-con-8n3 .box-8n3-pane .box-cat-waterwheel .detail .title a, html[data-theme="dark"] .box-con-8n3 .box-8n3-pane .box-cat-waterwheel .detail .info .new, html[data-theme="dark"] .box-user-vipinfo .rand-renew, html[data-theme="dark"] .box-userinfo .user-info-form>div .upfile-btn, html[data-theme="dark"] .box-wallet .count-info .count, html[data-theme="dark"] .mh-item-tip .mh-item-tip-detali .title a, html[data-theme="dark"] .mh-item .mh-item-detali .title a, html[data-theme="dark"] .mh-item .mh-item-detali p.chapter, html[data-theme="dark"] .mh-item .mh-item-detali .info .new, html[data-theme="dark"] .mh-item.big .mh-item-detali .desc span, html[data-theme="dark"] .mh-itme-top, html[data-theme="dark"] .mh-itme-top>a, html[data-theme="dark"] .vip-banner-big .aside-box .open-vip-btn, html[data-theme="dark"] .vip-banner-simple .open-vip-btn, html[data-theme="dark"] .vip-chart-block .left-side h2, html[data-theme="dark"] .vip-chart-block .right-side h2, html[data-theme="dark"] .vip-grow-con h1, html[data-theme="dark"] .vip-grow-con .line-btn .btn.disable, html[data-theme="dark"] .vip-pay-item ul li .price-wrap .sign, html[data-theme="dark"] .vip-reason ul.col2 li span.title, html[data-theme="dark"] .vip-reason ul.col6 li span.title, html[data-theme="dark"] .vip-recharge-con .txt-ad a, html[data-theme="dark"] .vip-recharge-con .recharge-body, html[data-theme="dark"] .vip-recharge-con .amount-list li div .time span, html[data-theme="dark"] .vip-table thead td, html[data-theme="dark"] .vip-succeed h1, html[data-theme="dark"] .view-comment-main h2 { color: var(--dk-text); } html[data-theme="dark"] .index-banner-control a, html[data-theme="dark"] .index-original-control a, html[data-theme="dark"] .view-comment-main .child-list li .info textarea, html[data-theme="dark"] .banner_puzzle .swiper-pagination-switch, html[data-theme="dark"] .banner_puzzle_bak .swiper-pagination-switch, html[data-theme="dark"] .banner_waterwheel .carousel img, html[data-theme="dark"] .banner_waterwheel .pagination span, html[data-theme="dark"] .account-box .right:before, html[data-theme="dark"] .account-login-form .three dt:after, html[data-theme="dark"] .account-login-form .three dt:before, html[data-theme="dark"] .mh-list-swiper .swiper-pagination-switch, html[data-theme="dark"] .vip-box-title .head-pagination span { background-color: var(--dk-line); } html[data-theme="dark"] .index-rank-logo, html[data-theme="dark"] .index-original-list li .info .desc, html[data-theme="dark"] .index-original-list li .info .tag a, html[data-theme="dark"] .index-rank-list li .sign span, html[data-theme="dark"] .index-rank-list li .info .subtitle, html[data-theme="dark"] .index-manga-list li .subtitle, html[data-theme="dark"] .index-manga-detail .detail .subtitle, html[data-theme="dark"] .index-manga-detail .detail .tag span, html[data-theme="dark"] .view-comment-main .list li .info .title .re, html[data-theme="dark"] body.white .view-comment-main .list li .info .content, html[data-theme="dark"] body.white .view-comment-main .top .page .block, html[data-theme="dark"] body.white .view-comment-main .top .page a, html[data-theme="dark"] body.white .view-comment-main .top .page span, html[data-theme="dark"] body.white .view-comment-main .bottom-page .block, html[data-theme="dark"] body.white .view-comment-main .bottom-page a, html[data-theme="dark"] body.white .view-comment-main .bottom-page span, html[data-theme="dark"] .view-comment .detail-list-subtitle .date, html[data-theme="dark"] .view-comment .view-comment-sub .sub-bar .slide .tip, html[data-theme="dark"] .view-comment .view-comment-sub .sub-bar .btn-1.active, html[data-theme="dark"] .view-comment .view-comment-sub .sub-manga .top .select a, html[data-theme="dark"] .view-comment .view-comment-sub .sub-manga .list li .cover span, html[data-theme="dark"] .view-comment .view-comment-sub .sub-manga .list li .info .subtitle-new, html[data-theme="dark"] .view-comment .view-comment-sub .sub-manga .list li .info .tip, html[data-theme="dark"] .view-comment .view-comment-sub .sub-manga .list li .num, html[data-theme="dark"] .view-comment .warning-bar p, html[data-theme="dark"] .view-comment .left-bar .top .info .subtitle, html[data-theme="dark"] .view-comment .left-bar .top .info .tag span, html[data-theme="dark"] .view-comment .left-bar .top .info .content, html[data-theme="dark"] .index-booklist-list li .subtitle a, html[data-theme="dark"] .index-rank-bar .right-list li .sign span, html[data-theme="dark"] .index-friendship .title, html[data-theme="dark"] .index-right-float li a, html[data-theme="dark"] .dk_options .disabled a, html[data-theme="dark"] .table-body table td a, html[data-theme="dark"] .table-body table th a, html[data-theme="dark"] .icheckbox_line-green, html[data-theme="dark"] .iradio_line-green, html[data-theme="dark"] .about-page .describe, html[data-theme="dark"] .about-page .forms .panel, html[data-theme="dark"] .modal-wrap .modal .modal-body .close, html[data-theme="dark"] .modal-wrap .modal .modal-body.vip-modal .foot, html[data-theme="dark"] .modal-wrap .modal .modal-body.vip-modal .foot .other-btn, html[data-theme="dark"] .modal-wrap .modal .modal-body.paydetail-modal>div .logs table td, html[data-theme="dark"] .down-app-page .banner-box p, html[data-theme="dark"] .scan-pay-box .order-info p>span, html[data-theme="dark"] .box .box-header>small, html[data-theme="dark"] .box .box-header .top-type a, html[data-theme="dark"] .box-head-sort dd, html[data-theme="dark"] .box-booklist-edit-head .del-btn, html[data-theme="dark"] .header-search-list ul li .type_2 .info .subtitle, html[data-theme="dark"] .header-search-list ul li .type_2 .info .tag span, html[data-theme="dark"] .hover .hover-list .block ul li .info .subtitle, html[data-theme="dark"] .hover .hover-list .block ul li .info .tip, html[data-theme="dark"] .hover .hover-user .block .top .info .title, html[data-theme="dark"] .hover .hover-user .block .line, html[data-theme="dark"] .hover .hover-user .block .bottom a, html[data-theme="dark"] .brand-head .head-wrap .head .info p, html[data-theme="dark"] .cat-filter .footer-btn:hover, html[data-theme="dark"] .page-pagination ul li span, html[data-theme="dark"] .page-pagination ul li a, html[data-theme="dark"] .page-pagination .select-wrap, html[data-theme="dark"] .page-pagination .jump, html[data-theme="dark"] .banner_detail_form .info .subtitle, html[data-theme="dark"] .banner_detail_form .info .subtitle a, html[data-theme="dark"] .banner_detail_form .info .content, html[data-theme="dark"] .banner_detail_form .info .bottom .btn-1.active, html[data-theme="dark"] .banner_detail_form .info .bottom .btn-3, html[data-theme="dark"] .banner_detail_form .info .bottom .btn-4, html[data-theme="dark"] .banner_detail_form .info .bottom .btn-5, html[data-theme="dark"] .account-box.text-tip .form-wrap .tip, html[data-theme="dark"] .account-login-form .form-wrap .verify .reloadimg, html[data-theme="dark"] .account-login-form .form-wrap .options, html[data-theme="dark"] .account-login-form .form-wrap .options .find-pwd a, html[data-theme="dark"] .account-login-form .three dt, html[data-theme="dark"] .booklist .title, html[data-theme="dark"] .booklist .sub, html[data-theme="dark"] .box-con-5n1 .detail-tabs-container .detail-tabs-pane .detail .info, html[data-theme="dark"] .box-con-5n1 .detail-tabs-container .detail-tabs-pane .detail .label span, html[data-theme="dark"] .box-con-5n1 .detail-tabs-container .detail-tabs-pane .detail .desc, html[data-theme="dark"] .box-con-8n3 .box-8n3-pane .box-cat-waterwheel .detail .info, html[data-theme="dark"] .box-con-8n3 .box-8n3-pane .box-cat-waterwheel .detail .label span, html[data-theme="dark"] .box-con-8n3 .box-8n3-pane .box-cat-waterwheel .detail .desc, html[data-theme="dark"] .user-repasswd .tip, html[data-theme="dark"] .box-user-vipinfo .rand-info .desc, html[data-theme="dark"] .box-user-vipinfo .rand-renew .label, html[data-theme="dark"] .box-userinfo .user-info-form>div>label, html[data-theme="dark"] .box-wallet .desc p, html[data-theme="dark"] .box-wallet .count-info, html[data-theme="dark"] .mh-item-tip .mh-item-tip-detali p.author, html[data-theme="dark"] .mh-item-tip .mh-item-tip-detali p.chapter, html[data-theme="dark"] .mh-item-tip .mh-item-tip-detali p.author a, html[data-theme="dark"] .mh-item-tip .mh-item-tip-detali p.author a:hover, html[data-theme="dark"] .mh-item-tip .mh-item-tip-detali .desc, html[data-theme="dark"] .mh-item .mh-item-detali p.mh-label span, html[data-theme="dark"] .mh-item .mh-item-detali .info, html[data-theme="dark"] .mh-item .fav-btn.active, html[data-theme="dark"] .mh-item .chapter-list a, html[data-theme="dark"] .mh-item.horizontal .mh-item-detali .desc, html[data-theme="dark"] .mh-itme-top .num, html[data-theme="dark"] .mh-list-swiper .next, html[data-theme="dark"] .mh-list-swiper .prev, html[data-theme="dark"] .vip-chart-block .left-side p, html[data-theme="dark"] .vip-chart-block .middle>p, html[data-theme="dark"] .vip-chart-block .right-side p, html[data-theme="dark"] .vip-grow-con p, html[data-theme="dark"] .vip-grow-con table td, html[data-theme="dark"] .vip-jumbotron .jumbotron-pane p, html[data-theme="dark"] .vip-reason ul.col2 li span.sub, html[data-theme="dark"] .vip-recharge-con .amount-list li div, html[data-theme="dark"] .vip-table tbody td, html[data-theme="dark"] .footer-cont a, html[data-theme="dark"] .sr-qrcode__text { color: var(--dk-text-2); } html[data-theme="dark"] .index-original-list li .info .tag a, html[data-theme="dark"] .index-manga-detail .detail .tag span, html[data-theme="dark"] .view-comment-main .list li .info .comment-item .code input, html[data-theme="dark"] body.white .view-comment-main .top .page .block, html[data-theme="dark"] body.white .view-comment-main .top .page a, html[data-theme="dark"] body.white .view-comment-main .top .page span, html[data-theme="dark"] body.white .view-comment-main, html[data-theme="dark"] body.white .view-comment-main .list li .info textarea, html[data-theme="dark"] body.white .view-comment-main .list li .info input, html[data-theme="dark"] body.white .view-comment-main .child-list li .info textarea, html[data-theme="dark"] body.white .view-comment-main .bottom-page .block, html[data-theme="dark"] body.white .view-comment-main .bottom-page a, html[data-theme="dark"] body.white .view-comment-main .bottom-page span, html[data-theme="dark"] .view-comment .view-comment-sub .avatar-bar, html[data-theme="dark"] .view-comment .view-comment-sub .sub-bar, html[data-theme="dark"] .view-comment .view-comment-sub .sub-manga, html[data-theme="dark"] .view-comment .warning-bar a, html[data-theme="dark"] .view-comment .left-bar .top, html[data-theme="dark"] .view-comment .left-bar .top .info .tag span, html[data-theme="dark"] .view-comment .left-bar .list, html[data-theme="dark"] .dk_toggle, html[data-theme="dark"] .table-head .table-tabs li a, html[data-theme="dark"] .about-page .forms .panel textarea, html[data-theme="dark"] .about-page .forms .panel input[type=text], html[data-theme="dark"] .modal-wrap .modal .modal-body.vip-modal .foot .other-btn, html[data-theme="dark"] .modal-wrap .modal .modal-body.paydetail-modal, html[data-theme="dark"] .modal-wrap .modal .modal-body.paydetail-modal>div, html[data-theme="dark"] .scan-pay-box .goods-info, html[data-theme="dark"] .scan-pay-box .pay-wrap, html[data-theme="dark"] .scan-pay-box .pay-wrap .pay-qr-box dd.pay-qrimg, html[data-theme="dark"] .box-booklist-edit-head .del-btn, html[data-theme="dark"] .header-search-list, html[data-theme="dark"] .header-search-list ul li .type_2 .info .tag span, html[data-theme="dark"] .hover .hover-list .block, html[data-theme="dark"] .hover .hover-user .block, html[data-theme="dark"] .page-pagination ul li a, html[data-theme="dark"] .page-pagination .select-wrap, html[data-theme="dark"] .page-pagination .jump input, html[data-theme="dark"] .user-sidebar .user-info .avatar img, html[data-theme="dark"] .banner_detail_form .info .bottom .btn-3, html[data-theme="dark"] .account-login-form .form-wrap input[type=password], html[data-theme="dark"] .account-login-form .form-wrap input[type=text], html[data-theme="dark"] .box-con-5n1 .detail-tabs-container .detail-tabs-pane .detail .label span, html[data-theme="dark"] .box-con-5n1 .detail-tabs li, html[data-theme="dark"] .box-con-8n3 .box-8n3-pane .box-cat-waterwheel .carousel-wrap .carousel img, html[data-theme="dark"] .box-con-8n3 .box-8n3-pane .box-cat-waterwheel .detail .label span, html[data-theme="dark"] .user-repasswd p input, html[data-theme="dark"] .box-userinfo .user-info-form .avatar-edit-wrap .avatar-edit .cropper-wrap-box, html[data-theme="dark"] .box-userinfo .user-info-form .avatar-edit-wrap .preview-wrap span img, html[data-theme="dark"] .box-userinfo .user-info-form>div .avatar-demo img, html[data-theme="dark"] .box-userinfo .user-info-form>div input, html[data-theme="dark"] .box-userinfo .user-info-form>div textarea, html[data-theme="dark"] .box-userinfo .user-info-form>div .upfile-btn, html[data-theme="dark"] .mh-item .mh-item-detali p.mh-label span, html[data-theme="dark"] .mh-itme-top .num, html[data-theme="dark"] .vip-chart-block .middle, html[data-theme="dark"] .vip-grow-con .line-btn .btn.disable, html[data-theme="dark"] .vip-grow-con table td, html[data-theme="dark"] .vip-pay-item ul li, html[data-theme="dark"] .vip-reason ul li, html[data-theme="dark"] .vip-reason ul li.active:after, html[data-theme="dark"] .vip-recharge-con .recharge-body, html[data-theme="dark"] .vipcode input, html[data-theme="dark"] .vip-recharge-con .channel-list li div, html[data-theme="dark"] .vip-recharge-con .amount-list li div, html[data-theme="dark"] .vip-recharge-con li div:after, html[data-theme="dark"] .vip-recharge-con li div:before, html[data-theme="dark"] .vip-table tbody td, html[data-theme="dark"] .vip-succeed .button { border-color: var(--dk-line); } html[data-theme="dark"] .index-original-arrow .left:hover, html[data-theme="dark"] .index-original-arrow .right:hover, html[data-theme="dark"] body.white .view-comment-main .child-list, html[data-theme="dark"] .view-comment .view-win-list li, html[data-theme="dark"] .m-load-more-sm, html[data-theme="dark"] .view-comment .view-comment-sub .sub-bar .btn-1.active, html[data-theme="dark"] .view-comment .view-comment-sub .sub-manga .list li .cover span, html[data-theme="dark"] .view-comment .view-detail-list li, html[data-theme="dark"] .index-rank-bar .left-list li a, html[data-theme="dark"] .index-friendship, html[data-theme="dark"] .bg-gray, html[data-theme="dark"] .icheckbox_line-green, html[data-theme="dark"] .iradio_line-green, html[data-theme="dark"] .dk_theme_orange, html[data-theme="dark"] .modal-wrap .modal .modal-body.paydetail-modal, html[data-theme="dark"] .scan-pay-box .goods-info, html[data-theme="dark"] .footer, html[data-theme="dark"] .banner_detail_form .info .bottom .btn-1.active, html[data-theme="dark"] .box-userinfo .user-info-form>div .upfile-btn, html[data-theme="dark"] .mh-item .fav-btn.active, html[data-theme="dark"] .mh-itme-top .num, html[data-theme="dark"] .mh-list-swiper .next:hover, html[data-theme="dark"] .mh-list-swiper .prev:hover, html[data-theme="dark"] .mh-list.top-cat>li div:hover, html[data-theme="dark"] .vip-recharge-con .recharge-body .head { background-color: var(--dk-surface-2); } html[data-theme="dark"] .index-rank-list li, html[data-theme="dark"] body.white .view-comment-main .list li.solid, html[data-theme="dark"] body.white .view-comment-main .list li.dashed .info, html[data-theme="dark"] body.white .view-comment-main .top, html[data-theme="dark"] .view-comment .view-comment-sub .sub-manga .top, html[data-theme="dark"] .table-head, html[data-theme="dark"] .about-page .head, html[data-theme="dark"] .box .box-header.border-bottom, html[data-theme="dark"] .hover .hover-list .block ul li, html[data-theme="dark"] .cat-filter .field-wrap, html[data-theme="dark"] .cat-filter .cat-list, html[data-theme="dark"] .dateProgressBar .bar-wrap .data-list, html[data-theme="dark"] .user-sidebar .user-info, html[data-theme="dark"] .mh-itme-top, html[data-theme="dark"] .mh-list.top-cat>li>.title, html[data-theme="dark"] .vip-pay-item ul li .price-wrap { border-bottom-color: var(--dk-line); } html[data-theme="dark"] .index-manga-detail .detail-list li.active .img, html[data-theme="dark"] .view-comment-main .list li .info .title .vip, html[data-theme="dark"] .view-comment-main .list li .info .title .year, html[data-theme="dark"] body.white .view-comment-main .top .page .block, html[data-theme="dark"] body.white .view-comment-main .top .page a, html[data-theme="dark"] body.white .view-comment-main .top .page span, html[data-theme="dark"] body.white .view-comment-main, html[data-theme="dark"] body.white .view-comment-main .child-list li .info textarea, html[data-theme="dark"] body.white .view-comment-main .bottom-bar, html[data-theme="dark"] body.white .view-comment-main .bottom-page .block, html[data-theme="dark"] body.white .view-comment-main .bottom-page a, html[data-theme="dark"] body.white .view-comment-main .bottom-page span, html[data-theme="dark"] .view-comment .view-comment-sub .avatar-bar, html[data-theme="dark"] .view-comment .view-comment-sub .sub-bar, html[data-theme="dark"] .view-comment .view-comment-sub .sub-manga, html[data-theme="dark"] .view-comment .left-bar .top, html[data-theme="dark"] .view-comment .left-bar .list, html[data-theme="dark"] .view-comment .left-bar .list li .btn, html[data-theme="dark"] .index-right-float, html[data-theme="dark"] .index-right-float li a.index-side-code .index-float-code, html[data-theme="dark"] .dk_options, html[data-theme="dark"] .dk_options a, html[data-theme="dark"] .dk_options .disabled:focus, html[data-theme="dark"] .dk_options .disabled:focus a, html[data-theme="dark"] .dk_options .disabled:hover, html[data-theme="dark"] .dk_options .disabled:hover a, html[data-theme="dark"] body, html[data-theme="dark"] .search-input button, html[data-theme="dark"] .search-input input, html[data-theme="dark"] .table-body table thead tr, html[data-theme="dark"] .modal-wrap .modal .modal-body.vip-modal, html[data-theme="dark"] .modal-wrap .modal .modal-body.vip-modal .foot .other-btn, html[data-theme="dark"] .modal-wrap .modal .modal-body.login-modal, html[data-theme="dark"] .modal-wrap .modal .modal-body.paydetail-modal>div, html[data-theme="dark"] .down-app-page .banner-top .wrap .right .down-btn a, html[data-theme="dark"] .box-booklist-edit-head .del-btn, html[data-theme="dark"] .header, html[data-theme="dark"] .header-search-list, html[data-theme="dark"] .header-search-list ul li .type_2 .info .tag span, html[data-theme="dark"] .hover .hover-list .block, html[data-theme="dark"] .hover .hover-user .block, html[data-theme="dark"] .brand-head .head-wrap .head, html[data-theme="dark"] .cat-filter, html[data-theme="dark"] .dateProgressBar .bar-wrap .data-list, html[data-theme="dark"] .page-pagination select, html[data-theme="dark"] .topFIxedMenu>div .top-menu, html[data-theme="dark"] .user-sidebar, html[data-theme="dark"] .banner_detail_form, html[data-theme="dark"] .banner_detail_form .info .bottom .btn-3, html[data-theme="dark"] .banner_detail_form .info .bottom .btn-3 .code, html[data-theme="dark"] .banner_waterwheel .middle, html[data-theme="dark"] .banner_waterwheel .middle .waterwheel-body, html[data-theme="dark"] .box-con-5n1 .detail-tabs-container .detail-tabs-pane, html[data-theme="dark"] .box-con-8n3 .box-8n3-pane, html[data-theme="dark"] .box-con-8n3 .box-8n3-pane .box-cat-waterwheel .carousel-wrap .imgbg-box, html[data-theme="dark"] .box-userinfo .user-info-form .avatar-edit-wrap .avatar-edit .cropper-wrap-box, html[data-theme="dark"] .box-userinfo .user-info-form .avatar-edit-wrap .avatar-edit .cropper-modal, html[data-theme="dark"] .mh-item-tip, html[data-theme="dark"] .mh-item, html[data-theme="dark"] .mh-item .read-btn.line, html[data-theme="dark"] .mh-item .read-btn.line:hover, html[data-theme="dark"] .mh-item .read-btn.line:active, html[data-theme="dark"] .mh-item .chapter-list .chapter-more a, html[data-theme="dark"] .mh-itme-top, html[data-theme="dark"] .vip-banner-big .aside-box.converted h3:after, html[data-theme="dark"] .vip-banner-big .aside-box.converted h3:before, html[data-theme="dark"] .vip-banner-simple .grow-chart table td div span.rand-line:before, html[data-theme="dark"] .vip-banner-simple .grow-chart table td div span.rand-dan, html[data-theme="dark"] .vip-chart-block, html[data-theme="dark"] .vip-grow-con .line-btn .btn.line, html[data-theme="dark"] .vip-grow-con .line-btn .btn.disable, html[data-theme="dark"] .vip-grow-con table td, html[data-theme="dark"] .vip-jumbotron, html[data-theme="dark"] .vip-reason ul li, html[data-theme="dark"] .vip-table tbody td { background-color: var(--dk-surface); } html[data-theme="dark"] .view-comment-main .top span.s, html[data-theme="dark"] .box-user-vipinfo .rand-info, html[data-theme="dark"] .vip-banner-simple .grow-chart table td div span.rand-line, html[data-theme="dark"] .vip-pay-item ul li .time-wrap { border-right-color: var(--dk-line); } html[data-theme="dark"] .view-comment-main .list li .info .comment-item .code, html[data-theme="dark"] .view-comment-main .child-list li.open a, html[data-theme="dark"] body.white .view-comment-main .list li .info .comment-item .logo-1, html[data-theme="dark"] body.white .view-comment-main .list li .info .comment-item .logo-2, html[data-theme="dark"] body.white .view-comment-main .list li .info .comment-item, html[data-theme="dark"] body.white .view-comment-main .list li .info .bottom, html[data-theme="dark"] body.white .view-comment-main .list li .info .bottom .right .zan, html[data-theme="dark"] body.white .view-comment-main .list li .info .bottom .right .comment, html[data-theme="dark"] body.white .view-comment-main .top span.s, html[data-theme="dark"] .view-comment .detail-list-title .order, html[data-theme="dark"] .view-comment .view-comment-sub .sub-manga .list li .tip, html[data-theme="dark"] .view-comment .view-detail-list li .info .subtitle .del, html[data-theme="dark"] .view-comment .view-detail-list li .info .tip, html[data-theme="dark"] .view-comment .left-bar .list li .subtitle, html[data-theme="dark"] .index-friendship-list li a, html[data-theme="dark"] .table-body table thead, html[data-theme="dark"] .about-page pre, html[data-theme="dark"] .about-page .linkman-list li p, html[data-theme="dark"] .box-head-sort dt, html[data-theme="dark"] .footer, html[data-theme="dark"] .footer .footer-left .link span a, html[data-theme="dark"] .header-bar a, html[data-theme="dark"] .header-search-list .title, html[data-theme="dark"] .header-search-list ul li a.type_1 .right, html[data-theme="dark"] .hover .hover-list .block .title a, html[data-theme="dark"] .cat-filter .footer-btn, html[data-theme="dark"] .dateProgressBar .bar-wrap .data-list li span.date, html[data-theme="dark"] .user-sidebar .user-info span.label, html[data-theme="dark"] .banner_detail_form .info .tip .block, html[data-theme="dark"] .booklist .title small, html[data-theme="dark"] .mh-list.top-cat>li>.title, html[data-theme="dark"] .mh-list.top-cat>li>.title .more, html[data-theme="dark"] .vip-pay-item ul li .price-wrap .original, html[data-theme="dark"] .vip-reason ul.col6 li span.sub, html[data-theme="dark"] .vip-recharge-con .recharge-footer a, html[data-theme="dark"] .vip-succeed, html[data-theme="dark"] .vip-succeed .mb20, html[data-theme="dark"] .vip-succeed .button, html[data-theme="dark"] .footer-cont, html[data-theme="dark"] .huifu { color: var(--dk-text-3); } html[data-theme="dark"] body.white .view-comment-main .bottom-bar, html[data-theme="dark"] .view-comment .view-comment-sub .sub-manga .list li, html[data-theme="dark"] .view-comment .left-bar .list li, html[data-theme="dark"] .index-right-float li, html[data-theme="dark"] .modal-wrap .modal .modal-body.paydetail-modal>div .logs table td, html[data-theme="dark"] .header-search-list ul li a.type_1, html[data-theme="dark"] .topFIxedMenu>div .top-menu li a:after { border-top-color: var(--dk-line); } html[data-theme="dark"] .view-comment .view-win-list li:hover, html[data-theme="dark"] .view-comment .view-win-list li a:visited, html[data-theme="dark"] .view-comment .view-detail-list li:hover, html[data-theme="dark"] .index-rank-bar .left-list li.active a, html[data-theme="dark"] .index-rank-bar .left-list li:hover a, html[data-theme="dark"] .header-search-list ul li.active, html[data-theme="dark"] .header-search-list ul li:hover, html[data-theme="dark"] .mh-item .fav-btn:hover { background-color: var(--dk-accent-dim); } html[data-theme="dark"] .view-comment .view-comment-sub .sub-manga .top .select, html[data-theme="dark"] .dk_open .dk_toggle, html[data-theme="dark"] hr, html[data-theme="dark"] .box .box-header .top-type, html[data-theme="dark"] .dateProgressBar .bar-wrap .data-list li:after, html[data-theme="dark"] .footer { background-color: var(--dk-surface-3); } html[data-theme="dark"] .box-user-vipinfo .rand-info .desc>span, html[data-theme="dark"] .vip-rand-chart table td .rand-val { border-left-color: var(--dk-line); } html[data-theme="dark"] .mh-item .mh-item-detali p.zl { color: var(--dk-text-2) !important; } /* ------------------------------------------------------------------ MOBILE - sinh tu mstyle.css ------------------------------------------------------------------ */ html[data-theme="dark"] .bg-gray, html[data-theme="dark"] .vip-rank .dj-table th, html[data-theme="dark"] .manga-list-title-right-item.active, html[data-theme="dark"] .center-main-login-btn, html[data-theme="dark"] .center-bottom-menu-border, html[data-theme="dark"] .main-404-btn-cancel, html[data-theme="dark"] .detail-selector-item:before, html[data-theme="dark"] .detail-vip, html[data-theme="dark"] .detail-list-1 li a, html[data-theme="dark"] .detail-list-more, html[data-theme="dark"] .detail-comment-fix-bottom, html[data-theme="dark"] .detail-list-2 li, html[data-theme="dark"] .detail-list-comment-sublist, html[data-theme="dark"] .rank-list-info-left-index, html[data-theme="dark"] .win-comment-input, html[data-theme="dark"] .comment-input, html[data-theme="dark"] .manga-book-list-main { background-color: var(--dk-surface-2); } html[data-theme="dark"] .normal-top, html[data-theme="dark"] .search-top, html[data-theme="dark"] .vip-privilege-list, html[data-theme="dark"] .vip-exchange-title, html[data-theme="dark"] .vip-rank, html[data-theme="dark"] .vip-record, html[data-theme="dark"] .buy-manga, html[data-theme="dark"] .wallet-main, html[data-theme="dark"] .wallet-menu, html[data-theme="dark"] .vip-privilege-view, html[data-theme="dark"] .vip-area, html[data-theme="dark"] .manga-list, html[data-theme="dark"] .ticket-item, html[data-theme="dark"] .selector-top, html[data-theme="dark"] .center-main-list-border, html[data-theme="dark"] .detail-desc, html[data-theme="dark"] .detail-selector, html[data-theme="dark"] .detail-list-comment, html[data-theme="dark"] .manga-list-bar, html[data-theme="dark"] .rank-selector, html[data-theme="dark"] .rank-list li, html[data-theme="dark"] .book-list li, html[data-theme="dark"] .search-downlist-clear, html[data-theme="dark"] .ad-top-info, html[data-theme="dark"] .selector-update-top { border-bottom-color: var(--dk-line); } html[data-theme="dark"] .normal-top, html[data-theme="dark"] .search-top-input input, html[data-theme="dark"] .search-label-item, html[data-theme="dark"] .recharge-set li, html[data-theme="dark"] .vip-privilege-list, html[data-theme="dark"] .vip-rank, html[data-theme="dark"] .vip-record, html[data-theme="dark"] .buy-manga, html[data-theme="dark"] .wallet-main, html[data-theme="dark"] .wallet-menu, html[data-theme="dark"] .vip-main-cover, html[data-theme="dark"] .vip-main .dj-top-item-bar-circle2, html[data-theme="dark"] .vip-privilege-view, html[data-theme="dark"] .vip-area, html[data-theme="dark"] .manga-list, html[data-theme="dark"] .ticket-item, html[data-theme="dark"] .selector-top, html[data-theme="dark"] .center-main-info-cover, html[data-theme="dark"] .center-main-list li, html[data-theme="dark"] .center-main-list-border li, html[data-theme="dark"] .center-main-list li.avatar, html[data-theme="dark"] .center-main-list-border li.avatar, html[data-theme="dark"] .center-main-bottom-btn, html[data-theme="dark"] .center-bottom-menu, html[data-theme="dark"] .win-first, html[data-theme="dark"] .feedback-main-list-item, html[data-theme="dark"] .detail-desc, html[data-theme="dark"] .detail-selector, html[data-theme="dark"] .detail-selector-item:first-child:before, html[data-theme="dark"] .detail-vip-con, html[data-theme="dark"] .detail-list-title, html[data-theme="dark"] .detail-list-1, html[data-theme="dark"] .detail-fix-bottom, html[data-theme="dark"] .detail-comment-fix-bottom-a, html[data-theme="dark"] .coin-fix-bottom, html[data-theme="dark"] .detail-list-2, html[data-theme="dark"] .win-pay, html[data-theme="dark"] .win-pay2, html[data-theme="dark"] .win-pay-btn, html[data-theme="dark"] .detail-list-comment, html[data-theme="dark"] .index-menu, html[data-theme="dark"] .index-bottom, html[data-theme="dark"] .manga-list-bar, html[data-theme="dark"] .manga-list-bar-right-down, html[data-theme="dark"] .rank-selector, html[data-theme="dark"] .rank-list, html[data-theme="dark"] .book-list li, html[data-theme="dark"] .search-noData, html[data-theme="dark"] .search-downlist, html[data-theme="dark"] .win-comment, html[data-theme="dark"] .view-bottom-bar-item, html[data-theme="dark"] .selector-update-top, html[data-theme="dark"] .paginate-btn, html[data-theme="dark"] .manga-book-list-main-cover-item, html[data-theme="dark"] .vip-login-btn, html[data-theme="dark"] .shareForm .cancel, html[data-theme="dark"] .shareForm .shareList, html[data-theme="dark"] .page-pagination select { background-color: var(--dk-surface); } html[data-theme="dark"] .normal-top-title, html[data-theme="dark"] .search-label-item, html[data-theme="dark"] .search-class-title, html[data-theme="dark"] .recharge-selector-title, html[data-theme="dark"] .recharge-style-subtitle, html[data-theme="dark"] .recharge-style-title, html[data-theme="dark"] .recharge-set-title, html[data-theme="dark"] .vip-privilege-list-title, html[data-theme="dark"] .vip-rank .dj-title, html[data-theme="dark"] .vip-rank .dj-form-item, html[data-theme="dark"] .vip-rank .dj-table td, html[data-theme="dark"] .vip-record-title, html[data-theme="dark"] .vip-record-right, html[data-theme="dark"] .buy-manga-title, html[data-theme="dark"] .wallet-main-coin-value, html[data-theme="dark"] .wallet-menu-item, html[data-theme="dark"] .vip-main .dj-sign-value, html[data-theme="dark"] .vip-table .dj-table td, html[data-theme="dark"] .vip-privilege-view-title, html[data-theme="dark"] .vip-privilege-view-list-title, html[data-theme="dark"] .manga-list-title, html[data-theme="dark"] .manga-list-title-more, html[data-theme="dark"] .manga-list-title-right-item.active, html[data-theme="dark"] .manga-list-1-title, html[data-theme="dark"] .manga-list-1-title a, html[data-theme="dark"] .manga-list-2-title, html[data-theme="dark"] .manga-list-2-title a, html[data-theme="dark"] .manga-list-3-title, html[data-theme="dark"] .manga-list-3-title a, html[data-theme="dark"] .manga-list-3-tip, html[data-theme="dark"] .ticket-item.active .ticket-item-right-title, html[data-theme="dark"] .selector-top-item.active, html[data-theme="dark"] .selector-top-right-font, html[data-theme="dark"] .center-main-list-title, html[data-theme="dark"] .center-main-list-title-edit, html[data-theme="dark"] .center-main-bottom-btn, html[data-theme="dark"] .center-bottom-menu-item, html[data-theme="dark"] .protocol-title, html[data-theme="dark"] .win-first-title, html[data-theme="dark"] .feedback-main-list-item, html[data-theme="dark"] .feedback-main-textarea, html[data-theme="dark"] .feedback-main-input, html[data-theme="dark"] .main-404-btn-cancel, html[data-theme="dark"] .detail-selector-item.active, html[data-theme="dark"] .detail-list-title-1, html[data-theme="dark"] .detail-list-1 li a, html[data-theme="dark"] .detail-list-more, html[data-theme="dark"] .detail-list-2-info-title, html[data-theme="dark"] .win-pay-title, html[data-theme="dark"] .win-pay-title2, html[data-theme="dark"] .win-pay-btn, html[data-theme="dark"] .win-pay-btn-line-1, html[data-theme="dark"] .win-pay-chapter, html[data-theme="dark"] .detail-list-comment-title, html[data-theme="dark"] .detail-list-comment-content, html[data-theme="dark"] .detail-list-comment-sublist-content, html[data-theme="dark"] .index-menu-item-title, html[data-theme="dark"] .index-bottom-item, html[data-theme="dark"] .manga-list-bar-item.active, html[data-theme="dark"] .manga-list-bar-right, html[data-theme="dark"] .manga-list-bar-right-down-item, html[data-theme="dark"] .rank-selector-item.active, html[data-theme="dark"] .rank-list-info-right-title, html[data-theme="dark"] .book-desc, html[data-theme="dark"] .book-list-info-title, html[data-theme="dark"] .search-downlist-item-title, html[data-theme="dark"] .win-comment-title, html[data-theme="dark"] .view-bottom-bar-item, html[data-theme="dark"] .ad-top-info-main-right-title, html[data-theme="dark"] .pay-con-title, html[data-theme="dark"] .final-title, html[data-theme="dark"] .final-tip, html[data-theme="dark"] .selector-update-top-item.active, html[data-theme="dark"] .manga-book-list-main-title, html[data-theme="dark"] .vip-login-btn, html[data-theme="dark"] .shareForm .shareList a p { color: var(--dk-text); } html[data-theme="dark"] .search-title, html[data-theme="dark"] .title-1, html[data-theme="dark"] .recharge-selector-tip, html[data-theme="dark"] .recharge-style-tip, html[data-theme="dark"] .recharge-tip-bottom a, html[data-theme="dark"] .recharge-set-tip, html[data-theme="dark"] .vip-privilege-title, html[data-theme="dark"] .vip-privilege-list-content, html[data-theme="dark"] .vip-privilege-more, html[data-theme="dark"] .vip-rank .dj-text2, html[data-theme="dark"] .vip-rank .dj-form-sign, html[data-theme="dark"] .vip-rank .dj-table th, html[data-theme="dark"] .gary .vip-record-title, html[data-theme="dark"] .vip-record-tip, html[data-theme="dark"] .vip-record-rechange, html[data-theme="dark"] .buy-manga-author, html[data-theme="dark"] .buy-manga-right-title, html[data-theme="dark"] .wallet-main-coin-title, html[data-theme="dark"] .wallet-main-coin-bottom, html[data-theme="dark"] .vip-text-1, html[data-theme="dark"] .vip-text-2, html[data-theme="dark"] .vip-privilege-view-list-content, html[data-theme="dark"] .vip-privilege-view-more, html[data-theme="dark"] .vip-area-top-title, html[data-theme="dark"] .vip-area-bottom-title, html[data-theme="dark"] .manga-list-title.index .manga-list-title-more, html[data-theme="dark"] .manga-list-title-right-item, html[data-theme="dark"] .manga-list-3-author, html[data-theme="dark"] .manga-list-3-content, html[data-theme="dark"] .ticket-item.active .ticket-item-right-subtitle, html[data-theme="dark"] .ticket-item.active .ticket-item-right-tip, html[data-theme="dark"] .center-main-list-right-tip, html[data-theme="dark"] .protocol-content, html[data-theme="dark"] .win-first-close, html[data-theme="dark"] .feedback-main-title, html[data-theme="dark"] .detail-desc, html[data-theme="dark"] .detail-list-title-3, html[data-theme="dark"] .win-pay-subtitle, html[data-theme="dark"] .win-pay-tip, html[data-theme="dark"] .win-pay-btn-line-2, html[data-theme="dark"] .win-pay-check, html[data-theme="dark"] .win-pay-bottom-center, html[data-theme="dark"] .manga-noData, html[data-theme="dark"] .rank-list-info-left-index, html[data-theme="dark"] .book-list-info-desc, html[data-theme="dark"] .book-list-info-bottom, html[data-theme="dark"] .book-list-info-bottom-item, html[data-theme="dark"] .search-downlist-title, html[data-theme="dark"] .pic-verification-title, html[data-theme="dark"] .line-tip, html[data-theme="dark"] .line-tip-left, html[data-theme="dark"] .pay-con-btn, html[data-theme="dark"] .final-subtitle, html[data-theme="dark"] .page-pagination ul li span, html[data-theme="dark"] .page-pagination ul li a, html[data-theme="dark"] .page-pagination .select-wrap, html[data-theme="dark"] .page-pagination .jump { color: var(--dk-text-2); } html[data-theme="dark"] .search-label-item, html[data-theme="dark"] .recharge-selector li a, html[data-theme="dark"] .recharge-style li, html[data-theme="dark"] .recharge-set li, html[data-theme="dark"] .vip-rank .dj-form-item.gary, html[data-theme="dark"] .vip-rank .dj-table th, html[data-theme="dark"] .vip-rank .dj-table td, html[data-theme="dark"] .buy-manga-right, html[data-theme="dark"] .vip-table .dj-table th, html[data-theme="dark"] .vip-table .dj-table td, html[data-theme="dark"] .manga-list-title-right, html[data-theme="dark"] .line-container input, html[data-theme="dark"] .feedback-main-list-item, html[data-theme="dark"] .feedback-main-textarea, html[data-theme="dark"] .feedback-main-input, html[data-theme="dark"] .feedback-main-pic-item, html[data-theme="dark"] .main-404-btn-cancel, html[data-theme="dark"] .detail-main-cover, html[data-theme="dark"] .detail-selector-item-count, html[data-theme="dark"] .detail-list-1 li a, html[data-theme="dark"] .detail-list-more, html[data-theme="dark"] .coin-fix-bottom, html[data-theme="dark"] .win-pay-btn, html[data-theme="dark"] .detail-list-comment-sublist, html[data-theme="dark"] .rank-list-info-left-index, html[data-theme="dark"] .book-list-info-bottom-item, html[data-theme="dark"] .win-comment-input, html[data-theme="dark"] .comment-input, html[data-theme="dark"] .view-bottom-bar-item, html[data-theme="dark"] .pay-con-btn, html[data-theme="dark"] .manga-book-list-main, html[data-theme="dark"] .page-pagination ul li a, html[data-theme="dark"] .page-pagination .select-wrap, html[data-theme="dark"] .page-pagination .jump input { border-color: var(--dk-line); } html[data-theme="dark"] .recharge-selector-main span.delete, html[data-theme="dark"] .recharge-tip-line, html[data-theme="dark"] .recharge-set-right span, html[data-theme="dark"] .vip-exchange-input, html[data-theme="dark"] .vip-rank .dj-form-item.gary, html[data-theme="dark"] .vip-rank .dj-table .dj-table-g, html[data-theme="dark"] .buy-manga-right, html[data-theme="dark"] .vip-main .dj-top-item-title, html[data-theme="dark"] .vip-main .dj-top-item-num, html[data-theme="dark"] .vip-table .dj-table .dj-table-g, html[data-theme="dark"] .vip-privilege-view-list-title.gary, html[data-theme="dark"] .vip-privilege-view-list-content.gary, html[data-theme="dark"] .manga-list-1-tip, html[data-theme="dark"] .manga-list-2-tip a, html[data-theme="dark"] .ticket-item-right-title, html[data-theme="dark"] .ticket-item-right-subtitle, html[data-theme="dark"] .ticket-item-right-tip, html[data-theme="dark"] .selector-top-item, html[data-theme="dark"] .center-main-list-right-tip-gray, html[data-theme="dark"] .detail-selector-item, html[data-theme="dark"] .detail-selector-item-count, html[data-theme="dark"] .detail-list-title-right, html[data-theme="dark"] .detail-comment-fix-bottom-a, html[data-theme="dark"] .coin-fix-bottom, html[data-theme="dark"] .detail-list-2-info-subtitle, html[data-theme="dark"] .win-pay-del, html[data-theme="dark"] .win-pay-bottom-left, html[data-theme="dark"] .win-pay-tip-line, html[data-theme="dark"] .win-pay-content, html[data-theme="dark"] .win-pay-logo-con-right, html[data-theme="dark"] .detail-list-comment-subtitle, html[data-theme="dark"] .detail-list-comment-right, html[data-theme="dark"] .detail-list-comment-reply, html[data-theme="dark"] .detail-list-comment-go, html[data-theme="dark"] .detail-list-comment-sublist-title, html[data-theme="dark"] .detail-list-comment-sublist-title-right, html[data-theme="dark"] .detail-list-comment-sublist-more a, html[data-theme="dark"] .manga-list-bar-item, html[data-theme="dark"] .rank-selector-item, html[data-theme="dark"] .rank-list-info-right-subtitle, html[data-theme="dark"] .search-noData-title, html[data-theme="dark"] .search-downlist-clear, html[data-theme="dark"] .win-comment-input, html[data-theme="dark"] .comment-input, html[data-theme="dark"] .view-fix-top-bar-title, html[data-theme="dark"] .view-fix-bottom-bar-title, html[data-theme="dark"] .ad-top-info-main-right-subtitle, html[data-theme="dark"] .pay-con-subtitle, html[data-theme="dark"] .selector-update-top-item, html[data-theme="dark"] .manga-book-list-main-subtitle { color: var(--dk-text-3); } html[data-theme="dark"] .recharge-set li.active, html[data-theme="dark"] .feedback-main-list-item.active, html[data-theme="dark"] .win-pay-btn.active { background-color: var(--dk-accent-dim); } html[data-theme="dark"] .vip-privilege-list li, html[data-theme="dark"] .vip-rank, html[data-theme="dark"] .vip-record li, html[data-theme="dark"] .buy-manga, html[data-theme="dark"] .wallet-main, html[data-theme="dark"] .wallet-menu-item, html[data-theme="dark"] .vip-privilege-view, html[data-theme="dark"] .vip-area, html[data-theme="dark"] .vip-area-bottom, html[data-theme="dark"] .manga-list, html[data-theme="dark"] .ticket-item, html[data-theme="dark"] .ticket-item-right-tip, html[data-theme="dark"] .center-main-list-border, html[data-theme="dark"] .center-main-list li, html[data-theme="dark"] .center-main-list-border li, html[data-theme="dark"] .center-main-list li.avatar, html[data-theme="dark"] .center-main-list-border li.avatar, html[data-theme="dark"] .center-main-bottom-btn, html[data-theme="dark"] .center-bottom-menu-item, html[data-theme="dark"] .detail-selector, html[data-theme="dark"] .detail-fix-bottom, html[data-theme="dark"] .win-pay-bottom, html[data-theme="dark"] .detail-list-comment li, html[data-theme="dark"] .detail-list-comment-sublist li, html[data-theme="dark"] .index-bottom, html[data-theme="dark"] .manga-list-bar, html[data-theme="dark"] .manga-list-bar-right-down-item, html[data-theme="dark"] .rank-selector, html[data-theme="dark"] .rank-list, html[data-theme="dark"] .book-list li, html[data-theme="dark"] .search-downlist-item, html[data-theme="dark"] .search-downlist-clear { border-top-color: var(--dk-line); } html[data-theme="dark"] .vip-main .dj-top-block, html[data-theme="dark"] .vip-main .dj-top-item-bar-circle1, html[data-theme="dark"] .detail-list-comment-reply, html[data-theme="dark"] li.detail-list-comment-sublist-more, html[data-theme="dark"] .shareForm .shareList input { background-color: var(--dk-surface-3); } html[data-theme="dark"] .manga-list-title-right-item, html[data-theme="dark"] .center-main-bottom-btn.r50 { border-left-color: var(--dk-line); } html[data-theme="dark"] .swiper-pagination-bullet { background-color: var(--dk-line); } /* ------------------------------------------------------------------ TRANG DOC (PC) - sinh tu pc_read.css ------------------------------------------------------------------ */ html[data-theme="dark"] body::-webkit-scrollbar-thumb, html[data-theme="dark"] body ::-webkit-scrollbar-thumb, html[data-theme="dark"] #tools .night li, html[data-theme="dark"] #tools .read-model li, html[data-theme="dark"] #tools .barrage-switch li, html[data-theme="dark"] #tools .fullscreen-switch li, html[data-theme="dark"] #tools .auto_read li, html[data-theme="dark"] #tools .hz li, html[data-theme="dark"] #tools .zoom li { background-color: var(--dk-line); } html[data-theme="dark"] body, html[data-theme="dark"] a, html[data-theme="dark"] .headlines .synopsis, html[data-theme="dark"] .list-thumbnail .title, html[data-theme="dark"] .comic-list .title, html[data-theme="dark"] .reward-list>.item .attr, html[data-theme="dark"] #footerTools .ywz .ywzbox li, html[data-theme="dark"] .header .pageBd .pages, html[data-theme="dark"] .endPage ul.endBtns li.btnItem a:hover { color: var(--dk-text-2); } html[data-theme="dark"] hr, html[data-theme="dark"] .list>.item.line, html[data-theme="dark"] .list-thumbnail>.item, html[data-theme="dark"] .reward-list>.item, html[data-theme="dark"] .update-list .item, html[data-theme="dark"] .layui-layer-title, html[data-theme="dark"] .layui-layer-tab .layui-layer-title { border-bottom-color: var(--dk-line); } html[data-theme="dark"] .equal-height, html[data-theme="dark"] .equal-main, html[data-theme="dark"] .box2>.hd, html[data-theme="dark"] .box2>.bd, html[data-theme="dark"] .layui-layer-btn a, html[data-theme="dark"] .layui-layer-prompt .layui-layer-input, html[data-theme="dark"] #readguide .gocenter, html[data-theme="dark"] #tools>.item>.hd, html[data-theme="dark"] #tools>.item>.bd, html[data-theme="dark"] #tools .barrage-con .input { border-color: var(--dk-line); } html[data-theme="dark"] .equal-aside-left, html[data-theme="dark"] .equal-aside-right, html[data-theme="dark"] .box2>.hd, html[data-theme="dark"] .readend>.ft, html[data-theme="dark"] .layui-layer-title, html[data-theme="dark"] .layui-layer-btn a { background-color: var(--dk-surface-2); } html[data-theme="dark"] .list>.item, html[data-theme="dark"] .list-thumbnail .attr, html[data-theme="dark"] .comic-list .desc, html[data-theme="dark"] .reward-list>.item .reward-num, html[data-theme="dark"] .reward-list>.item .desc, html[data-theme="dark"] .reward-list>.item .attr-label, html[data-theme="dark"] .fans-list>.item .reward-num, html[data-theme="dark"] .box>.hd .title-desc, html[data-theme="dark"] .box2>.hd .update, html[data-theme="dark"] .box2>.hd .operate .ift-sort, html[data-theme="dark"] .box2>.hd .operate .ift-sort_up, html[data-theme="dark"] .comicpage .loading, html[data-theme="dark"] .comicpage .loaderr, html[data-theme="dark"] .readend .switch li, html[data-theme="dark"] .catalogCon .conBd .no-info, html[data-theme="dark"] #tools .rss, html[data-theme="dark"] #footer .copyright, html[data-theme="dark"] .doubleMode_swiper li .full_width .half .loaderr { color: var(--dk-text-3); } html[data-theme="dark"] .box>.hd .title-desc, html[data-theme="dark"] .box2>.hd .operate, html[data-theme="dark"] .layui-layer-tab .layui-layer-title span.layui-layer-tabnow { border-left-color: var(--dk-line); } html[data-theme="dark"] .readend, html[data-theme="dark"] .layui-layer, html[data-theme="dark"] .layui-layer-move, html[data-theme="dark"] .layui-layer-tab .layui-layer-title span.layui-layer-tabnow, html[data-theme="dark"] #footerTools .ywz .ywzbox, html[data-theme="dark"] #footerTools .whitebox, html[data-theme="dark"] .shareBox .shareBd a, html[data-theme="dark"] .catalogCon .conBd .item, html[data-theme="dark"] .phone .code, html[data-theme="dark"] #tools>.item>.hd .text, html[data-theme="dark"] #tools>.item>.hd [class^='ift-'], html[data-theme="dark"] #tools>.item>.bd, html[data-theme="dark"] #tools .night .full .left, html[data-theme="dark"] #tools .night .full .right, html[data-theme="dark"] #tools .read-model .full .left, html[data-theme="dark"] #tools .read-model .full .right, html[data-theme="dark"] #tools .barrage-switch .full .left, html[data-theme="dark"] #tools .barrage-switch .full .right, html[data-theme="dark"] #tools .fullscreen-switch .full .left, html[data-theme="dark"] #tools .fullscreen-switch .full .right, html[data-theme="dark"] #tools .auto_read .full .left, html[data-theme="dark"] #tools .auto_read .full .right, html[data-theme="dark"] #tools .hz .full .left, html[data-theme="dark"] #tools .hz .full .right, html[data-theme="dark"] #tools .zoom .full .left, html[data-theme="dark"] #tools .zoom .full .right, html[data-theme="dark"] #tools .night .full .top, html[data-theme="dark"] #tools .night .full .bottom, html[data-theme="dark"] #tools .read-model .full .top, html[data-theme="dark"] #tools .read-model .full .bottom, html[data-theme="dark"] #tools .barrage-switch .full .top, html[data-theme="dark"] #tools .barrage-switch .full .bottom, html[data-theme="dark"] #tools .fullscreen-switch .full .top, html[data-theme="dark"] #tools .fullscreen-switch .full .bottom, html[data-theme="dark"] #tools .auto_read .full .top, html[data-theme="dark"] #tools .auto_read .full .bottom, html[data-theme="dark"] #tools .hz .full .top, html[data-theme="dark"] #tools .hz .full .bottom, html[data-theme="dark"] #tools .zoom .full .top, html[data-theme="dark"] #tools .zoom .full .bottom { background-color: var(--dk-surface); } html[data-theme="dark"] .layui-layer-load, html[data-theme="dark"] .layui-layer-tab .layui-layer-title { background-color: var(--dk-surface-3); } html[data-theme="dark"] .layui-layer-title, html[data-theme="dark"] .layui-layer-btn a, html[data-theme="dark"] .layui-layer-prompt .layui-layer-input, html[data-theme="dark"] .catalogCon .conBd .item h2, html[data-theme="dark"] .phone .code p, html[data-theme="dark"] .doubleMode_swiper li .full_width .half .comicInfo { color: var(--dk-text); } html[data-theme="dark"] .layui-layer-tab .layui-layer-title span.layui-layer-tabnow { border-right-color: var(--dk-line); } html[data-theme="dark"] .stophover { color: var(--dk-text) !important; } html[data-theme="dark"] .stophover { background-color: var(--dk-line) !important; } html[data-theme="dark"] #footer { border-top-color: var(--dk-line); } /* ------------------------------------------------------------------ TRANG DOC (chung) - sinh tu p.css ------------------------------------------------------------------ */ html[data-theme="dark"] .read-section .sidebar-content li a, html[data-theme="dark"] .sidebar-btn { color: var(--dk-text-2); } /* ------------------------------------------------------------------ Style viet thang trong template (thuoc tinh style="...") Mau nam trong thuoc tinh style thang tren the HTML thi khong stylesheet nao de len duoc, tru khi dung !important. Thay vi sua rai rac ~20 file template, bat dung cac the do bang selector theo chuoi con. Them mau moi vao template thi nho them mot dong o day. ------------------------------------------------------------------ */ html[data-theme="dark"] [style*="background:#fff"], html[data-theme="dark"] [style*="background: #fff"], html[data-theme="dark"] [style*="background-color:#fff"], html[data-theme="dark"] [style*="background-color: #fff"] { background-color: var(--dk-surface) !important; } html[data-theme="dark"] [style*="background:#f5f5f5"], html[data-theme="dark"] [style*="background: #f5f5f5"], html[data-theme="dark"] [style*="background-color:#f8f8f8"], html[data-theme="dark"] [style*="background-color: #f8f8f8"], html[data-theme="dark"] [style*="background-color:#f5f5f5"] { background-color: var(--dk-surface-2) !important; } html[data-theme="dark"] [style*="color:#666"], html[data-theme="dark"] [style*="color: #666"] { color: var(--dk-text-2) !important; } html[data-theme="dark"] [style*="color:#999"], html[data-theme="dark"] [style*="color: #999"] { color: var(--dk-text-3) !important; } html[data-theme="dark"] [style*="border:1px solid #eee"], html[data-theme="dark"] [style*="border: 1px solid #eee"] { border-color: var(--dk-line) !important; } /* ------------------------------------------------------------------ Icon PNG mot mau, mau toi 14 file anh duoi day la icon don sac ve bang muc toi (mui ten, kinh lup, o khoa...). Tren nen sang chung hien binh thuong; sang nen toi thi bien mat. Dao mau cho rieng chung. Danh sach nay lay bang cach do do sang va do bao hoa cua tung file, khong phai doan - anh nhieu mau (logo, banner, anh bia) khong nam trong day va khong bi dung toi. ------------------------------------------------------------------ */ html[data-theme="dark"] img[src*="normal-top-back"], html[data-theme="dark"] img[src*="top-right-search"], html[data-theme="dark"] img[src*="wallet-menu-arrow"], html[data-theme="dark"] img[src*="center-main-right"], html[data-theme="dark"] img[src*="center-main-list-logo-1"], html[data-theme="dark"] img[src*="center-main-list-logo-2"], html[data-theme="dark"] img[src*="center-main-list-logo-3"], html[data-theme="dark"] img[src*="selector-top-right"], html[data-theme="dark"] img[src*="buy-manga-right"], html[data-theme="dark"] img[src*="detail-bottom-1"], html[data-theme="dark"] img[src*="detail-bottom-2"], html[data-theme="dark"] img[src*="reward.png"], html[data-theme="dark"] img[src*="messages.png"], html[data-theme="dark"] img[src*="lock.png"], html[data-theme="dark"] img[src*="key.png"] { filter: invert(1) brightness(.92); } /* ------------------------------------------------------------------ Widget binh luan (cmt.css) cmt.css tu chon bang mau bang @media (prefers-color-scheme). Neu de nguyen thi se lech: he dieu hanh sang + site toi -> khung binh luan trang giua trang toi. Buoc no bam theo theme cua site thay vi theo he dieu hanh. Selector o day (0,2,1) thang selector trong cmt.css (0,2,0). ------------------------------------------------------------------ */ html[data-theme="light"] .cmt-wrap, html[data-theme="light"] .cmt-bell { --cmt-bg: #ffffff; --cmt-bg-soft: #f5f6f8; --cmt-bg-hover: #eceef2; --cmt-border: #e2e5ea; --cmt-text: #1c1e21; --cmt-text-dim: #606770; --cmt-text-mute: #8a8d91; --cmt-accent-dim:#ffe9f0; } html[data-theme="dark"] .cmt-wrap, html[data-theme="dark"] .cmt-bell { --cmt-bg: #17181c; --cmt-bg-soft: #1e2026; --cmt-bg-hover: #24262e; --cmt-border: #2c2f38; --cmt-text: #e6e7ea; --cmt-text-dim: #9aa0a6; --cmt-text-mute: #6b7078; --cmt-accent-dim:#3a2029; } /* ------------------------------------------------------------------ Nut chuyen theme - PC (nam trong .header-bar) ------------------------------------------------------------------ */ /* Nut nam giua cac the anh em trong .header-bar, nen phai go het style mac dinh cua