body.single-product .dtf-reader-v6-desktop { position: fixed !important; width: 220px !important; max-height: calc(100vh - 128px) !important; overflow: hidden !important; overflow-anchor: none !important; display: flex !important; flex-direction: column !important; z-index: 9999 !important; border: 1px solid #e5e7eb !important; border-radius: 16px !important; background: #ffffff !important; box-shadow: 0 18px 42px rgba(15, 23, 42, .12) !important; opacity: 0 !important; visibility: hidden !important; transform: translateY(8px) !important; pointer-events: none !important; transition: opacity .2s ease, transform .2s ease, visibility .2s ease !important; } body.single-product.dtf-reader-v6-reading .dtf-reader-v6-desktop { opacity: 1 !important; visibility: visible !important; transform: translateY(0) !important; pointer-events: auto !important; } body.single-product .dtf-reader-v6-head { flex: 0 0 auto !important; padding: 14px 14px 12px !important; border-bottom: 1px solid #edf2f7 !important; background: linear-gradient(135deg, #ffffff 0%, #f8fbff 100%) !important; } body.single-product .dtf-reader-v6-head span { display: block !important; margin-bottom: 4px !important; color: #0079ad !important; font-size: 10px !important; line-height: 1.2 !important; font-weight: 900 !important; text-transform: uppercase !important; letter-spacing: .06em !important; } body.single-product .dtf-reader-v6-head strong { display: block !important; color: #111827 !important; font-size: 14px !important; line-height: 1.2 !important; font-weight: 900 !important; } body.single-product .dtf-reader-v6-head small { display: block !important; margin-top: 5px !important; color: #64748b !important; font-size: 11px !important; line-height: 1.25 !important; font-weight: 700 !important; } body.single-product .dtf-reader-v6-meter, body.single-product .dtf-reader-v6-progress-meter { height: 5px !important; background: #eef2f7 !important; overflow: hidden !important; } body.single-product .dtf-reader-v6-meter { flex: 0 0 auto !important; } body.single-product .dtf-reader-v6-meter i, body.single-product .dtf-reader-v6-progress-meter i { display: block !important; width: 0% !important; height: 100% !important; background: linear-gradient(90deg, #009fe3 0%, #00c48c 100%) !important; transition: width .18s ease !important; } body.single-product .dtf-reader-v6-list { padding: 10px !important; display: grid !important; gap: 3px !important; flex: 1 1 auto !important; min-height: 0 !important; overflow-y: auto !important; overflow-x: hidden !important; scrollbar-width: thin !important; scrollbar-color: rgba(100, 116, 139, .45) transparent !important; } body.single-product .dtf-reader-v6-list::-webkit-scrollbar { width: 6px !important; } body.single-product .dtf-reader-v6-list::-webkit-scrollbar-thumb { background: rgba(100, 116, 139, .45) !important; border-radius: 999px !important; } body.single-product .dtf-reader-v6-list::-webkit-scrollbar-track { background: transparent !important; } body.single-product .dtf-reader-v6-toc-link { display: block !important; text-decoration: none !important; border-radius: 11px !important; color: #475569 !important; font-size: 12px !important; line-height: 1.35 !important; font-weight: 700 !important; } body.single-product .dtf-reader-v6-toc-link--h2 { padding: 8px 10px !important; } body.single-product .dtf-reader-v6-toc-link--h3 { margin-left: 8px !important; padding: 6px 9px !important; border-left: 2px solid #e5e7eb !important; border-radius: 0 10px 10px 0 !important; color: #64748b !important; font-size: 11px !important; font-weight: 650 !important; } body.single-product .dtf-reader-v6-toc-link:hover, body.single-product .dtf-reader-v6-toc-link.is-active { color: #006ee6 !important; background: #eaf7ff !important; font-weight: 900 !important; } body.single-product .dtf-reader-v6-tabs, body.single-product .dtf-reader-v6-progress { display: none !important; } body.single-product.dtf-reader-v6-reading #header, body.single-product.dtf-reader-v6-reading #header.sticky-header, body.single-product.dtf-reader-v6-reading #header.sticky, body.single-product.dtf-reader-v6-reading .sticky-header, body.single-product.dtf-reader-v6-reading .fixed-header, body.single-product.dtf-reader-v6-reading .porto-sticky, body.single-product.dtf-reader-v6-reading .header-wrapper.sticky, body.single-product.dtf-reader-v6-reading .header-wrapper.fixed-header, body.single-product.dtf-reader-v6-reading .header-wrapper.sticky-header, body.single-product.dtf-reader-v6-reading .porto-mobile-bar, body.single-product.dtf-reader-v6-reading .porto-sticky-bottom, body.single-product.dtf-reader-v6-reading .mobile-bottom-nav, body.single-product.dtf-reader-v6-reading .bottom-navigation, body.single-product.dtf-reader-v6-reading .footer-mobile-menu, body.single-product.dtf-reader-v6-reading .mobile-sticky-bar, body.single-product.dtf-reader-v6-reading .porto-mobile-sticky, body.single-product.dtf-reader-v6-reading .sticky-add-to-cart, body.single-product.dtf-reader-v6-reading .porto-sticky-add-to-cart, body.single-product.dtf-reader-v6-reading [class*="sticky-add-to-cart"] { opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; } @media (max-width: 1199px) { body.single-product .dtf-reader-v6-desktop { display: none !important; } } @media (max-width: 991px) { body.single-product .dtf-reader-v6-tabs { display: flex !important; gap: 8px !important; position: fixed !important; left: 8px !important; right: 8px !important; top: calc(8px + env(safe-area-inset-top)) !important; z-index: 999999 !important; padding: 8px !important; overflow-x: auto !important; overflow-y: hidden !important; -webkit-overflow-scrolling: touch !important; background: rgba(255, 255, 255, .97) !important; backdrop-filter: blur(12px) !important; border: 1px solid #e5e7eb !important; border-radius: 14px !important; box-shadow: 0 12px 28px rgba(15, 23, 42, .13) !important; scrollbar-width: none !important; opacity: 0 !important; visibility: hidden !important; transform: translateY(-10px) !important; pointer-events: none !important; transition: opacity .2s ease, transform .2s ease, visibility .2s ease !important; } body.admin-bar.single-product .dtf-reader-v6-tabs { top: 54px !important; } body.single-product.dtf-reader-v6-reading .dtf-reader-v6-tabs { opacity: 1 !important; visibility: visible !important; transform: translateY(0) !important; pointer-events: auto !important; } body.single-product .dtf-reader-v6-tabs::-webkit-scrollbar { display: none !important; } body.single-product .dtf-reader-v6-tab { flex: 0 0 auto !important; min-height: 33px !important; padding: 0 12px !important; border: 1px solid #e5e7eb !important; border-radius: 999px !important; background: #ffffff !important; color: #334155 !important; font-size: 11px !important; line-height: 1 !important; font-weight: 900 !important; white-space: nowrap !important; cursor: pointer !important; } body.single-product .dtf-reader-v6-tab.is-active { background: #07111f !important; border-color: #07111f !important; color: #ffffff !important; } body.single-product .dtf-reader-v6-progress { display: block !important; position: fixed !important; left: 8px !important; right: 8px !important; bottom: calc(12px + env(safe-area-inset-bottom)) !important; z-index: 999999 !important; padding: 9px 10px !important; border: 1px solid #dbeafe !important; border-radius: 15px !important; background: rgba(255, 255, 255, .96) !important; backdrop-filter: blur(12px) !important; box-shadow: 0 18px 42px rgba(15, 23, 42, .18) !important; opacity: 0 !important; visibility: hidden !important; transform: translateY(16px) !important; pointer-events: none !important; transition: opacity .2s ease, transform .2s ease, visibility .2s ease !important; } body.single-product.dtf-reader-v6-reading .dtf-reader-v6-progress { opacity: 1 !important; visibility: visible !important; transform: translateY(0) !important; pointer-events: auto !important; } body.single-product .dtf-reader-v6-progress-top { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important; } body.single-product .dtf-reader-v6-progress-top span { color: #64748b !important; font-size: 10px !important; line-height: 1 !important; font-weight: 900 !important; text-transform: uppercase !important; letter-spacing: .055em !important; } body.single-product .dtf-reader-v6-progress-top strong { color: #07111f !important; font-size: 13px !important; line-height: 1 !important; font-weight: 900 !important; } body.single-product .dtf-reader-v6-progress-meter { margin: 8px 0 !important; border-radius: 999px !important; } body.single-product .dtf-reader-v6-current { display: block !important; min-width: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; color: #111827 !important; font-size: 11.5px !important; line-height: 1.2 !important; font-weight: 850 !important; } body.single-product .dtf-product-description h2, body.single-product .dtf-product-description h3 { scroll-margin-top: 88px !important; } } @media (max-width: 767px) { body.single-product .dtf-reader-v6-tabs { left: 7px !important; right: 7px !important; padding: 7px !important; } body.single-product .dtf-reader-v6-tab { min-height: 32px !important; padding: 0 11px !important; font-size: 10.8px !important; } body.single-product .dtf-reader-v6-progress { left: 7px !important; right: 7px !important; } }