@charset "utf-8";

/* CSS	 Document */

.dark-theme-app .custom-select {
	background: transparent;
}

.dark-theme-app .for-light {
	display: none;
}

.dark-theme-app .for-dark {
	display: inline-block;
}

.dark-theme-app .premium-plan,
.dark-theme-app .table-responsive::-webkit-scrollbar-thumb {
	background: #505050;
}

.dark-theme-app .main-page {
	background: var(--color-darkmode-outer-bg);
}

.dark-theme-app html,
.dark-theme-app .choose-table tr th,
.dark-theme-app .choose-table tr td,
.dark-theme-app .login-box,
.dark-theme-app .support-msg,
.dark-theme-app .white-box,
.dark-theme-app .nav-pills .nav-link,
.dark-theme-app .nav-pills .nav-link.active,
.dark-theme-app .nav-pills .show > .nav-link,
.dark-theme-app .watch-list-area,
.dark-theme-app .scanner-filter-area,
.dark-theme-app .gamma-info-grp,
.dark-theme-app .performance-card,
.dark-theme-app .ticker-btn,
.dark-theme-app .reveal-data,
.dark-theme-app .alert-dialog-container,
.dark-theme-app .MuiDialog-container,
.dark-theme-app .show-reveal-data,
.dark-theme-app .select-items,
.dark-theme-app .performance-table,
.dark-theme-app .risk-rating,
.dark-theme-app .ticker-detail-menu,
.dark-theme-app .range-box,
.dark-theme-app .main-table.custom-scrollable-table .table-rounded thead,
.menu-close .dark-theme-app .sidebar ul li:hover a,
.menu-close .dark-theme-app .bottom-modes,
.dark-theme-app .held-tickers,
.dark-theme-app .table-rounded,
.dark-theme-app .custom-dropdown,
.dark-theme-app header,
.dark-theme-app .multi-row-header .main-table .table-rounded thead tr,
.dark-theme-app .dark-header tr,
.dark-theme-app .sidebar {
	background: var(--color-darkmode-main-bg);
}

.dark-theme-app .header-dropdown .dropdown-menu:after {
	border-bottom-color: #363636;
}

.dark-theme-app .header-search input,
.dark-theme-app .settings .select-selected,
.dark-theme-app .watch-list-main li.watch-list.see-more span,
.dark-theme-app .watch-list-main li span,
.dark-theme-app .choose-table thead tr th,
.dark-theme-app .choose-table tbody tr td:nth-child(1),
.dark-theme-app .choose-table tbody tr th:nth-child(1),
.dark-theme-app .choose-table tbody tr td:nth-child(1),
.dark-theme-app .table th,
.dark-theme-app .table td,
.dark-theme-app .faq .card,
.dark-theme-app .white-box,
.dark-theme-app .table-radio .l-radio,
.dark-theme-app .table-input,
.dark-theme-app .table-dropdown-menu h6,
.dark-theme-app .table-dropdown-menu,
.dark-theme-app .download-btn,
.dark-theme-app .goto-btn,
.dark-theme-app .add-ticker-input input,
.dark-theme-app .custom-select-box .select-selected,
.menu-close .dark-theme-app .bottom-modes,
.dark-theme-app .table-rounded thead th,
.dark-theme-app .custom-dropdown h5,
.dark-theme-app .logo-section {
	border-color: rgb(141 162 219 / 10%);
}

.dark-theme-app .cbx span:first-child {
	border-color: #ffffff;
}

.dark-theme-app .fixed_header_active_tickers thead tr,
.dark-theme-app .fixed_header_active_tickers,
.dark-theme-app .MuiTab-wrapper,
.dark-theme-app .white-txt,
.dark-theme-app .white-txt h6,
.dark-theme-app .white-txt svg,
.dark-theme-app .white-txt h5,
.dark-theme-app .white-txt button {
	color: #ffffff !important;
}

.dark-theme-app .switch input + span:after {
	background: #909090;
}

.dark-theme-app header,
.dark-theme-app .sidebar {
	border: none;
}

.dark-theme-app .modal-content {
	background: var(--color-darkmode-outer-bg);
	box-shadow: 0px 0px 10px #7d7d7d;
}

.dark-theme-app .current-plan-box,
.dark-theme-app .table-dropdown-menu,
.dark-theme-app .select-items div:hover,
.dark-theme-app .sidebar ul li a:before,
.dark-theme-app .custom-dropdown ul li span:hover,
.dark-theme-app .header-dropdown .textarea,
.dark-theme-app {
	background: var(--color-darkmode-outer-bg);
}

.dark-theme-app .switch input:checked + span:before,
.dark-theme-app .switch input + span:before {
	background: #484848;
}

.dark-theme-app .dropdown-icon {
	background-color: #ffffff;
	padding-left: 0.5rem !important;
	-webkit-mask: url(/assets/images/app-icons/down-arrow.svg) no-repeat center;
	mask: url(/assets/images/app-icons/down-arrow.svg) no-repeat center;
}

.dark-theme-app .dropdown-icon-active {
	background-color: #fff;
	padding-left: 0.5rem !important;
	-webkit-mask: url(/assets/images/app-icons/down-arrow.svg) no-repeat center;
	mask: url(/assets/images/app-icons/down-arrow.svg) no-repeat center;
}

.dark-theme-app #add-ticker-list-filter-type-select,
.dark-theme-app .scanner-drop span,
.dark-theme-app .profile-list li span,
.dark-theme-app .wp-element-caption,
.dark-theme-app .wp-block-pullquote,
.dark-theme-app .modal-welcome p,
.dark-theme-app .modal-welcome h6,
.dark-theme-app .modal-welcome h2,
.dark-theme-app .chart-section .chart-data li a,
.dark-theme-app .graph-control li.nav-item .nav-link,
.dark-theme-app .current-plan-box .plan-am span,
.dark-theme-app .current-plan-box .plan-am,
.dark-theme-app .plan-type,
.dark-theme-app .plan-head,
.dark-theme-app .current-plan-box .plan-nam,
.dark-theme-app .cbx span:last-child,
.dark-theme-app .settings .select-selected,
.dark-theme-app .settings .white-box p,
.dark-theme-app #meh:checked ~ .rating-label-meh,
.dark-theme-app .rating-label,
.dark-theme-app .ticker-btn,
.dark-theme-app .numberbox,
.dark-theme-app .addons-section .choose-table h6,
.dark-theme-app .form-grp label,
.dark-theme-app .rangeLabel,
.dark-theme-app .support-msg h6,
.dark-theme-app .support-msg p,
.dark-theme-app .custom-select-box .select-selected,
.menu-close .dark-theme-app .sidebar .menu-nav:hover ul li a .sidebar-text,
.menu-close .dark-theme-app .sidebar ul li:hover .sidebar-text,
.dark-theme-app .table-rounded tbody td span,
.dark-theme-app .switch input + span strong,
.dark-theme-app .model-form input,
.dark-theme-app .scanner-drop label,
.dark-theme-app .scanner-drop .table-dropdown,
.dark-theme-app .table-dropdown-menu,
.dark-theme-app .sidebar ul li a .sidebar-text {
	color: #ffffff;
	opacity: 1;
}

.dark-theme-app .black-text p,
.dark-theme-app .black-text h1,
.dark-theme-app .black-text h2 {
	color: #000000;
}

.dark-theme-app .switch input:checked + span:after {
	background: #14bdef;
}

.dark-theme-app #fun:checked ~ .rating-label-fun,
.dark-theme-app .rating-label-meh,
.dark-theme-app .nav-pills .nav-link.active,
.menu-close .dark-theme-app .sidebar ul li:hover .active .sidebar-text,
.dark-theme-app header .profile i,
.dark-theme-app .download-btn,
.dark-theme-app .goto-btn,
.dark-theme-app .sidebar ul li a.active .sidebar-text {
	color: #14bdef;
}

.dark-theme-app .empty-table p,
.dark-theme-app .input-description,
.dark-theme-app .custom-dropdown ul li span,
.dark-theme-app .header-dropdown .textarea h5,
.dark-theme-app .table-heading {
	color: #ffffff;
}

.dark-theme-app .addons-section .choose-table thead tr th,
.dark-theme-app .table-rounded thead th {
	color: #ffffff;
}

.dark-theme-app h6,
.dark-theme-app .dropdown-menu small,
.dark-theme-app .coll-drop:after,
.dark-theme-app .choose-bottom p,
.dark-theme-app .choose-table .plan-amount,
.dark-theme-app .choose-table .plan-choose,
.dark-theme-app .choose-table tr h5,
.dark-theme-app .form-grp select,
.dark-theme-app .form-grp select,
.dark-theme-app .form-grp textarea,
.dark-theme-app .form-grp input,
.dark-theme-app .alert-dialog-container,
.dark-theme-app .video-title,
.dark-theme-app .faq .btn-clean:after,
.dark-theme-app .faq .btn-clean,
.dark-theme-app .modal-ticker h5,
.dark-theme-app .table-input,
.dark-theme-app .table-dropdown-menu h6,
.dark-theme-app .table-rounded td span,
.dark-theme-app .table td,
.dark-theme-app .MuiTableCell-root,
.dark-theme-app .purchase-wizard-text-box,
.dark-theme-app .text-gray {
	color: #ffffff;
}

.dark-theme-app h1,
.dark-theme-app h2,
.dark-theme-app h3,
.dark-theme-app h4,
.dark-theme-app h5,
.dark-theme-app small {
	color: #fff;
}

.dark-theme-app .react-loading-skeleton {
	--base-color: var(--color-darkmode-outer-bg);
	--highlight-color: #ffffff;
}

.dark-theme-app .dropdown-menu .premium-plan p,
.dark-theme-app .viewRenderer h5,
.dark-theme-app .tab-pane h5,
.dark-theme-app .MuiTypography-root h2,
.dark-theme-app .alert-dialog-container h2,
.dark-theme-app .empty-table h5,
.dark-theme-app .mainAssetPrice,
.dark-theme-app .ticker-detail h5,
.dark-theme-app .header-search input,
.dark-theme-app .add-ticker-input input,
.dark-theme-app .select-items div,
.dark-theme-app em,
.dark-theme-app .custom-dropdown h5,
.dark-theme-app .header-dropdown .textarea p,
.dark-theme-app .page-title h2,
.dark-theme-app .profile-list li a {
	color: #fff;
}

.dark-theme-app .header-dropdown .drop-btn {
	border-color: var(--color-darkmode-outer-bg);
	background-color: transparent;
	color: #fff;
}

.dark-theme-app .coll-drop:after,
.menu-close .dark-theme-app .sidebar ul li:hover .sidebar-text,
.dark-theme-app .nav-pills .nav-link.active,
.dark-theme-app .empty-table p,
.dark-theme-app .header-dropdown .textarea p {
	opacity: 1;
}

.dark-theme-app .form-grp input::placeholder,
.dark-theme-app .faq .card-body,
.dark-theme-app .nav-pills .nav-link,
.dark-theme-app .modal-ticker p,
.dark-theme-app p,
.dark-theme-app .blog ul,
.dark-theme-app .blog ol,
.dark-theme-app .pagination span,
.dark-theme-app .table-input::placeholder,
.dark-theme-app .add-ticker-input input::placeholder,
.dark-theme-app .header-search:after,
.dark-theme-app .header-search input::placeholder {
	color: #ffffff !important;
	opacity: 1 !important;
}

.dark-theme-app .watch-list-main li span:hover,
.dark-theme-app .watch-list-main li span {
	color: #ffffff;
	opacity: 1;
}

.dark-theme-app .unsubscribe-tr {
	background: linear-gradient(to left, rgb(41 52 87 / 97%) 100%, rgb(41 52 87) 0%);
}

.dark-theme-app .settings .select-selected,
.dark-theme-app .form-grp textarea,
.dark-theme-app .form-grp select,
.dark-theme-app .form-grp input,
.dark-theme-app .table-input,
.dark-theme-app .table-input:focus,
.dark-theme-app .download-btn,
.dark-theme-app .goto-btn,
.dark-theme-app .add-ticker-input input,
.dark-theme-app .custom-select-box .select-selected,
.dark-theme-app .bg-area,
.dark-theme-app .header-search input,
.dark-theme-app .btn-drop,
.dark-theme-app .model-form input,
.dark-theme-app .table-responsive::-webkit-scrollbar-track,
.dark-theme-app .header-dropdown .dropdown-menu,
.dark-theme-app .watch-list-main li.active span,
.dark-theme-app header .profile {
	background: #363636;
}

.dark-theme-app #alert-dialog-description,
.dark-theme-app #dialog__extra_tickers_body1,
.dark-theme-app #dialog__extra_tickers_body2,
.dark-theme-app #dialog__extra_tickers_list {
	color: #212529 !important;
}

.menu-close .dark-theme-app .switch input + span strong,
.menu-close .dark-theme-app .sidebar ul li a .sidebar-text {
	opacity: 0;
}

.dark-theme-app .unactive-icon {
	display: none;
}
.dark-theme-app .active .dark-icon {
	display: none;
}
.dark-theme-app .dark-icon {
	display: block;
}
.dark-theme-app .card {
	background: transparent;
}
.menu-close .dark-theme-app .sidebar ul li:hover a .sidebar-icon .dark-icon {
	display: none;
}
.dark-theme-app .watchlist-dropdown.header-profile.header-dropdown .dropdown-menu {
	border: 1px solid var(--color-darkmode-outer-bg);
}

.dark-theme-app .addons-section .choose-table tbody tr th:nth-child(1),
.dark-theme-app .addons-section .choose-table tbody tr td:nth-child(1) {
	border-top: 2px solid rgb(31 30 30 / 10%);
}

/* Trend Icon background styles */
.dark-theme-app .bearish-background {
	background: #69383f;
}

.dark-theme-app .bullish-background {
	background: #316254;
}

.dark-theme-app .neutral-background {
	background: #6c5422;
}

.dark-theme-app .neutralDanger-background {
	background: #314d66;
}

.dark-theme-app .RowActionButton {
	border: 0;
	background-color: var(--color-darkmode-main-bg);
}

.dark-theme-app .MuiDialogContentText-root {
	color: #ffffff;
}

.dark-theme-app .MuiTypography-h6 {
	color: #ffffff;
}

/* Material-UI Dialog paper background for dark mode */
.dark-theme-app .MuiDialog-paper {
	background-color: var(--color-darkmode-outer-bg);
	color: #ffffff;
}

/* Material-UI Dialog title text color */
.dark-theme-app .MuiDialogTitle-root {
	color: #ffffff;
}

/* Material-UI Dialog content text color */
.dark-theme-app .MuiDialogContent-root {
	color: #ffffff;
}

/* Material-UI Typography in dialogs */
.dark-theme-app .MuiDialog-paper .MuiTypography-root {
	color: #ffffff;
}

/* Material-UI Box components in dialogs */
.dark-theme-app .MuiDialog-paper .MuiBox-root {
	color: #ffffff;
}

.dark-theme-app .cftc-section .table tr td:nth-child(10),
.dark-theme-app .cftc-section .table tr th:nth-child(10) {
	border-left-color: #354272;
}

.dark-theme-app .cftc-section .table thead tr:nth-child(1) th:nth-child(9) {
	border-left-color: var(--color-darkmode-outer-bg);
}

.dark-theme-app .cftc-section .table tr td:nth-child(11),
.dark-theme-app .cftc-section .table tr th:nth-child(11),
.dark-theme-app .cftc-section .table tr td:nth-child(10),
.dark-theme-app .cftc-section .table tr th:nth-child(10),
.dark-theme-app .cftc-section .table tr td:nth-child(9),
.dark-theme-app .cftc-section .table tr th:nth-child(9),
.dark-theme-app .cftc-section .table tr td:nth-child(8),
.dark-theme-app .cftc-section .table tr th:nth-child(8) {
	background: #3a4d80;
}
.dark-theme-app .cftc-section .table thead tr:nth-child(1) th span {
	background: rgb(41 52 87 / 62%);
}
.dark-theme-app .cftc-section .table tr:nth-child(1) th {
	background: none;
}

.dark-theme-app .volatilitv-main table tbody tr td:nth-child(8),
.dark-theme-app .volatilitv-main table thead tr:nth-child(2) th:nth-child(8),
.dark-theme-app .volatilitv-main table thead tr:nth-child(1) th:nth-child(4),
.dark-theme-app .volatilitv-main table tbody tr td:nth-child(6),
.dark-theme-app .volatilitv-main table thead tr:nth-child(2) th:nth-child(6),
.dark-theme-app .volatilitv-main table thead tr:nth-child(1) th:nth-child(3) {
	border-left: 12px solid var(--color-darkmode-outer-bg) !important;
}

.dark-theme-app .risk-rating li,
.dark-theme-app .performance-table li {
	border-bottom: 1px;
	border-bottom-color: rgb(255 255 255 / 4%);
	border-bottom-style: solid;
}

.dark-theme-app .hurst-series-table tbody tr,
.dark-theme-app .ticker-detail-correlation-table tbody tr {
	height: 50px;
	border-bottom: 1px;
	border-bottom-color: rgb(255 255 255 / 4%);
	border-bottom-style: solid;
}

/* Email opt-in dialog styling fix for dark mode */
.dark-theme-app .email-opt-in-dialog .MuiDialogTitle-root,
.dark-theme-app .email-opt-in-dialog .MuiDialogTitle-root h6,
.dark-theme-app .email-opt-in-dialog .MuiDialogContentText-root,
.dark-theme-app .email-opt-in-dialog .MuiTypography-root,
.dark-theme-app .email-opt-in-dialog .MuiPaper-root .MuiTypography-h6 {
	color: #212529 !important; /* Match other dialogs' dark text color */
}

/* Ensure paragraph and other text elements inside the dialog are also visible */
.dark-theme-app .email-opt-in-dialog p,
.dark-theme-app .email-opt-in-dialog span,
.dark-theme-app .email-opt-in-dialog div {
	color: #212529 !important;
}

/* Override any inline styles that might be applied */
.dark-theme-app .email-opt-in-dialog [style*="color"] {
	color: #212529 !important;
}

/* Fix custom select dropdown arrow visibility in dark mode */
.dark-theme-app .custom-select-box .select-selected:after,
.dark-theme-app .custom-select-box .select-refresh .select-selected:after {
	color: #ffffff !important;
}

/* Blog/Trading Plan dark mode styles */
.dark-theme-app .blog-container .blog-post-item {
	background: #1e1e1e;
	border: 1px solid #333;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.dark-theme-app .blog-container .blog-post-item:hover {
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6);
	transform: translateY(-2px);
}

.dark-theme-app .blog-container .blog-post-content {
	color: #e0e0e0;
}

.dark-theme-app .blog-post-author {
	color: #aaa;
}

.dark-theme-app .blog-post-author .author-name {
	color: #42a5f5;
}

.dark-theme-app .blog-container .blog-post-content strong,
.dark-theme-app .blog-container .blog-post-content b {
	color: #42a5f5;
	font-weight: 800 !important;
}

.dark-theme-app .blog-container .blog-post-content blockquote {
	color: #aaa;
	border-left-color: #42a5f5;
}

.dark-theme-app .blog-container .blog-post-content pre,
.dark-theme-app .blog-container .blog-post-content code {
	background-color: #2a2a2a;
	color: #e0e0e0;
}

.dark-theme-app .blog-container .blog-post-content th {
	background-color: #2a2a2a;
	color: #42a5f5;
}

.dark-theme-app .blog-container .blog-post-content td,
.dark-theme-app .blog-container .blog-post-content th {
	border-bottom-color: #444;
}

.dark-theme-app .blog-container .pagination span {
	color: #aaa;
}

/* Additional blog dark mode styles from blog.css */
.dark-theme-app .blog-container .blog-post-content a {
	color: #42a5f5;
}

.dark-theme-app .blog-container .blog-post-content a:hover {
	color: #64b5f6;
}

/* Dark mode for headings in blog content */
.dark-theme-app .blog-container .blog-post-content h1,
.dark-theme-app .blog-container .blog-post-content h2,
.dark-theme-app .blog-container .blog-post-content h3,
.dark-theme-app .blog-container .blog-post-content h4,
.dark-theme-app .blog-container .blog-post-content h5,
.dark-theme-app .blog-container .blog-post-content h6 {
	color: #42a5f5;
}

/* Reading progress indicator for dark mode */
.dark-theme-app .reading-progress-bar {
	background-color: #42a5f5;
}

/* Blog Preview Sales Page Dark Mode */
.dark-theme-app .blog-preview-sales-page {
	background: linear-gradient(135deg, #1a1a1a 0%, #2a2a2a 100%);
}

.dark-theme-app .hero-title {
	color: #ffffff;
}

.dark-theme-app .hero-subtitle {
	color: #b0b0b0;
}

.dark-theme-app .stat-item p {
	color: #999;
}

.dark-theme-app .blog-preview-sample {
	background: #2a2a2a;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

.dark-theme-app .sample-header {
	border-bottom-color: #444;
}

.dark-theme-app .sample-date {
	color: #999;
}

.dark-theme-app .sample-title {
	color: #ffffff;
}

.dark-theme-app .sample-author {
	color: #42a5f5;
}

.dark-theme-app .sample-excerpt,
.dark-theme-app .blurred-text {
	color: #e0e0e0;
}

.dark-theme-app .locked-overlay {
	background: rgba(42, 42, 42, 0.95);
}

.dark-theme-app .lock-icon,
.dark-theme-app .locked-overlay p {
	color: #999;
}

/* Fix bullet points in blog preview sample content */
.dark-theme-app .blog-preview-sample ul li {
	color: #e0e0e0;
}

.dark-theme-app .benefit-card {
	background: #2a2a2a;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

.dark-theme-app .benefit-card:hover {
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.5);
}

.dark-theme-app .benefit-icon {
	background: linear-gradient(135deg, #1a3a52 0%, #1a4a5e 100%);
}

.dark-theme-app .benefit-title {
	color: #ffffff;
}

.dark-theme-app .benefit-description {
	color: #999;
}

.dark-theme-app .blog-preview-cta {
	background: linear-gradient(135deg, #1565c0 0%, #0d47a1 100%);
}

.dark-theme-app .social-proof-text {
	color: #999;
}

.dark-theme-app .social-proof-text strong {
	color: #42a5f5;
}

/* Reading progress indicator for dark mode */
.dark-theme-app .reading-progress-bar {
	background-color: #42a5f5;
}

/* ===============================================
   COMMENTS SYSTEM DARK MODE STYLES
   =============================================== */

/* Comment Form Dark Mode */
.dark-theme-app .comment-form-paper {
	background: linear-gradient(135deg, #1e1e1e 0%, #2d2d2d 100%);
	color: #e0e0e0;
}

.dark-theme-app .comment-form-character-count {
	color: #999;
}

.dark-theme-app .comment-form-draft-indicator {
	color: #81c784;
}

.dark-theme-app .comment-form-text-field .MuiOutlinedInput-root {
	background-color: rgba(0, 0, 0, 0.4);
	color: white;
	border: 1px solid rgba(255, 255, 255, 0.1);
}

.dark-theme-app .comment-form-text-field .MuiOutlinedInput-root:hover {
	background-color: rgba(0, 0, 0, 0.6);
	border: 1px solid rgba(255, 255, 255, 0.2);
}

.dark-theme-app .comment-form-text-field .MuiOutlinedInput-root.Mui-focused {
	background-color: rgba(0, 0, 0, 0.6);
	border: 1px solid #42a5f5;
	box-shadow: 0 0 20px rgba(66, 165, 245, 0.2);
}

.dark-theme-app .comment-form-text-field .MuiInputLabel-root {
	color: #999;
}

.dark-theme-app .comment-form-text-field textarea {
	color: #e0e0e0;
}

.dark-theme-app .comment-form-text-field textarea::placeholder {
	color: #999;
	opacity: 0.7;
}

.dark-theme-app .comment-form-display-name-select .MuiOutlinedInput-root {
	background-color: rgba(0, 0, 0, 0.4);
	border-color: rgba(255, 255, 255, 0.1);
	color: white;
}

.dark-theme-app .comment-form-display-name-select .MuiOutlinedInput-root:hover {
	background-color: rgba(0, 0, 0, 0.6);
	border-color: rgba(255, 255, 255, 0.2);
}

.dark-theme-app .comment-form-display-name-select .MuiOutlinedInput-root.Mui-focused {
	background-color: rgba(0, 0, 0, 0.6);
	border-color: #42a5f5;
}

.dark-theme-app .comment-form-display-name-select .MuiSelect-icon {
	color: #999;
}

.dark-theme-app .comment-form-display-name-select p {
	color: #e0e0e0;
}

.dark-theme-app .comment-form-loading-overlay {
	background-color: rgba(0, 0, 0, 0.8);
}

/* Individual Comment Dark Mode */
.dark-theme-app .comment-paper {
	background-color: #1e1e1e;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
	color: #e0e0e0;
}

.dark-theme-app .comment-paper:hover {
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5);
}

.dark-theme-app .comment-nested .comment-paper {
	background-color: rgba(255, 255, 255, 0.02);
}

.dark-theme-app .comment-author-name {
	color: #42a5f5;
}

.dark-theme-app .comment-timestamp {
	color: #999;
}

.dark-theme-app .comment-edited-badge {
	background-color: #333;
	color: #999;
}

.dark-theme-app .comment-content {
	color: #e0e0e0;
}

.dark-theme-app .comment-action-button {
	color: #999;
}

.dark-theme-app .comment-action-button:hover {
	background-color: rgba(255, 255, 255, 0.05);
}

.dark-theme-app .comment-reply-button {
	color: #42a5f5;
}

.dark-theme-app .comment-reply-button:hover {
	background-color: rgba(66, 165, 245, 0.1);
}

.dark-theme-app .comment-collapse-button {
	color: #999;
}

.dark-theme-app .comment-collapse-button:hover {
	background-color: rgba(255, 255, 255, 0.05);
}

.dark-theme-app .comment-menu-button {
	color: #999;
}

.dark-theme-app .comment-menu-button:hover {
	background-color: rgba(255, 255, 255, 0.05);
}

/* Comments Section Dark Mode */
.dark-theme-app .comments-section-title-text {
	color: #e0e0e0;
}

.dark-theme-app .comments-empty-state {
	background-color: #1e1e1e;
	color: #e0e0e0;
}

.dark-theme-app .comments-login-prompt {
	background-color: rgba(33, 150, 243, 0.1);
	color: #e0e0e0;
}

.dark-theme-app .comments-drafts-container {
	background-color: #1e1e1e;
	border: 1px solid rgba(255, 255, 255, 0.1);
}

.dark-theme-app .comments-draft-item {
	border-bottom-color: rgba(255, 255, 255, 0.05);
	color: #e0e0e0;
}

.dark-theme-app .comments-draft-item:hover {
	background-color: rgba(255, 255, 255, 0.02);
}

.dark-theme-app .comments-draft-alert {
	background: linear-gradient(135deg, #1a237e 0%, #283593 100%);
	border: 1px solid #3949ab;
	color: #e0e0e0;
}

.dark-theme-app .comments-draft-preview {
	color: #e0e0e0;
}

.dark-theme-app .comments-draft-meta {
	color: #999;
}

/* Legacy Comment Form Dark Mode */
.dark-theme-app .comment-form-textarea {
	background-color: #1e1e1e;
	border-color: #333;
	color: #e0e0e0;
}

.dark-theme-app .comment-form-textarea:focus {
	border-color: #42a5f5;
	box-shadow: 0 0 0 3px rgba(66, 165, 245, 0.2);
	background-color: #2d2d2d;
}

.dark-theme-app .comment-form-textarea::placeholder {
	color: #999;
	opacity: 0.8;
}

.dark-theme-app .character-counter {
	color: #999;
}

.dark-theme-app .draft-indicator {
	color: #81c784;
}

/* Loading and Skeleton Dark Mode */
.dark-theme-app .comment-skeleton-avatar {
	background-color: #333;
}

.dark-theme-app .comment-skeleton-line {
	background-color: #333;
}

/* Typography improvements for dark theme */
.dark-theme-app h1,
.dark-theme-app h2,
.dark-theme-app h3,
.dark-theme-app h4,
.dark-theme-app h5,
.dark-theme-app h6 {
	color: #e0e0e0;
}

.dark-theme-app .MuiTypography-colorTextSecondary {
	color: #999 !important;
}

/* Fix missing dark mode elements in comments */
.dark-theme-app .comments-section-root svg,
.dark-theme-app .comments-section-header svg {
	color: #e0e0e0 !important;
}

.dark-theme-app .comment-actions .MuiIconButton-label,
.dark-theme-app .comment-actions .MuiIconButton-label svg {
	color: #999 !important;
}

.dark-theme-app .comment-actions .MuiIconButton-root:hover .MuiIconButton-label,
.dark-theme-app .comment-actions .MuiIconButton-root:hover .MuiIconButton-label svg {
	color: #e0e0e0 !important;
}

.dark-theme-app .comment-actions span {
	color: #e0e0e0 !important;
}

.dark-theme-app .comments-list svg {
	color: #999 !important;
}

.dark-theme-app .comment-paper .MuiIconButton-label,
.dark-theme-app .comment-paper .MuiIconButton-label svg {
	color: #999 !important;
}

.dark-theme-app .comment-paper .MuiIconButton-root:hover .MuiIconButton-label,
.dark-theme-app .comment-paper .MuiIconButton-root:hover .MuiIconButton-label svg {
	color: #e0e0e0 !important;
}

/* Make nested comment actions brighter */
.dark-theme-app .comments-list .MuiCollapse-container .comment-actions > div > div,
.dark-theme-app .comments-list .MuiCollapse-container .comment-actions > div > div *,
.dark-theme-app .comments-list .MuiCollapse-container .comment-actions button,
.dark-theme-app .comments-list .MuiCollapse-container .comment-actions button *,
.dark-theme-app .comments-list .MuiCollapse-container .comment-actions .MuiIconButton-label,
.dark-theme-app .comments-list .MuiCollapse-container .comment-actions .MuiIconButton-label svg {
	color: #e0e0e0 !important;
}

.dark-theme-app .comments-list .MuiCollapse-container .comment-actions button:hover,
.dark-theme-app .comments-list .MuiCollapse-container .comment-actions button:hover * {
	color: #ffffff !important;
}

/* Blog post item button dark mode */
.dark-theme-app .blog-post-item button,
.dark-theme-app .blog-post-item button span,
.dark-theme-app .blog-post-item button svg {
	color: #e0e0e0 !important;
}

.dark-theme-app .blog-post-item button:hover,
.dark-theme-app .blog-post-item button:hover span,
.dark-theme-app .blog-post-item button:hover svg {
	color: #ffffff !important;
	background-color: rgba(255, 255, 255, 0.08);
}

/* ===============================================
   LIKE BUTTON DARK MODE STYLES & ANIMATIONS
   =============================================== */

/* Base like button styles for dark mode */
.dark-theme-app .like-button-container {
	color: #e0e0e0;
}

.dark-theme-app .like-button {
	background: rgba(255, 255, 255, 0.08);
	color: #e0e0e0;
	border: 1px solid rgba(255, 255, 255, 0.2);
}

.dark-theme-app .like-button:hover {
	background: rgba(255, 255, 255, 0.15);
	border-color: rgba(255, 255, 255, 0.3);
	box-shadow: 0 4px 20px rgba(255, 255, 255, 0.1);
}

.dark-theme-app .like-button.liked {
	background: linear-gradient(135deg, rgba(244, 67, 54, 0.2) 0%, rgba(233, 30, 99, 0.2) 100%);
	border-color: #e91e63;
	color: #ff6b6b;
}

.dark-theme-app .like-button.liked:hover {
	background: linear-gradient(135deg, rgba(244, 67, 54, 0.3) 0%, rgba(233, 30, 99, 0.3) 100%);
	box-shadow: 0 4px 20px rgba(233, 30, 99, 0.3);
}

/* Heart icon colors in dark mode */
.dark-theme-app .like-button .heart-icon {
	color: #999;
}

.dark-theme-app .like-button:hover .heart-icon {
	color: #e0e0e0;
}

.dark-theme-app .like-button.liked .heart-icon {
	color: #ff6b6b;
}

/* Like count text */
.dark-theme-app .like-count {
	color: #e0e0e0;
}

.dark-theme-app .like-button.liked .like-count {
	color: #ff6b6b;
}

/* Morphing animation adjustments for dark mode */
.dark-theme-app .like-button-morphing .morph-shape {
	/* Phase 1: Initial burst - make more visible */
	box-shadow: 0 0 40px rgba(255, 107, 107, 0.8), 0 0 80px rgba(255, 107, 107, 0.6),
		inset 0 0 20px rgba(255, 255, 255, 0.3);
	background: radial-gradient(
		circle at center,
		rgba(255, 107, 107, 0.9) 0%,
		rgba(233, 30, 99, 0.8) 50%,
		rgba(255, 255, 255, 0.2) 100%
	);
}

/* Phase 2: Make the morph more visible in dark mode with orange instead of blue */
@keyframes dark-morphAnimation {
	0% {
		transform: scale(1) rotate(0deg);
		border-radius: 50%;
		background: radial-gradient(circle at center, rgba(255, 107, 107, 0.9) 0%, rgba(233, 30, 99, 0.8) 100%);
		box-shadow: 0 0 40px rgba(255, 107, 107, 0.8), 0 0 80px rgba(255, 107, 107, 0.6);
	}
	20% {
		transform: scale(1.3) rotate(72deg);
		border-radius: 20%;
		background: radial-gradient(circle at center, rgba(255, 182, 193, 0.9) 0%, rgba(255, 107, 107, 0.8) 100%);
		box-shadow: 0 0 50px rgba(255, 182, 193, 0.9), 0 0 100px rgba(255, 107, 107, 0.7);
	}
	40% {
		transform: scale(1.6) rotate(144deg);
		border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
		background: linear-gradient(
			45deg,
			rgba(255, 165, 0, 0.9) 0%,
			rgba(255, 140, 0, 0.8) 50%,
			rgba(255, 107, 107, 0.8) 100%
		);
		box-shadow: 0 0 60px rgba(255, 165, 0, 0.8), 0 0 120px rgba(255, 140, 0, 0.6);
	}
	60% {
		transform: scale(2) rotate(216deg);
		border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%;
		background: linear-gradient(
			135deg,
			rgba(255, 107, 107, 0.9) 0%,
			rgba(255, 165, 0, 0.8) 50%,
			rgba(233, 30, 99, 0.8) 100%
		);
		box-shadow: 0 0 70px rgba(255, 107, 107, 0.9), 0 0 140px rgba(255, 165, 0, 0.7);
	}
	80% {
		transform: scale(2.5) rotate(288deg);
		border-radius: 40% 60% 60% 40% / 60% 40% 60% 40%;
		opacity: 0.6;
		background: radial-gradient(circle at center, rgba(255, 255, 255, 0.8) 0%, rgba(255, 107, 107, 0.6) 100%);
		box-shadow: 0 0 80px rgba(255, 255, 255, 0.8), 0 0 160px rgba(255, 107, 107, 0.5);
	}
	100% {
		transform: scale(3) rotate(360deg);
		border-radius: 50%;
		opacity: 0;
		background: radial-gradient(circle at center, rgba(255, 255, 255, 0.4) 0%, transparent 100%);
		box-shadow: 0 0 100px rgba(255, 255, 255, 0.4), 0 0 200px transparent;
	}
}

.dark-theme-app .like-button-morphing .morph-shape {
	animation: dark-morphAnimation 1.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;
}

/* Particle effects for dark mode */
.dark-theme-app .particle {
	background: #ff6b6b;
	box-shadow: 0 0 10px rgba(255, 107, 107, 0.8), 0 0 20px rgba(255, 107, 107, 0.6);
}

.dark-theme-app .particle:nth-child(odd) {
	background: #ffb6c1;
	box-shadow: 0 0 10px rgba(255, 182, 193, 0.8), 0 0 20px rgba(255, 182, 193, 0.6);
}

/* Ring pulse effect for dark mode */
.dark-theme-app .ring-pulse {
	border-color: rgba(255, 107, 107, 0.8);
	box-shadow: 0 0 20px rgba(255, 107, 107, 0.6), inset 0 0 20px rgba(255, 107, 107, 0.4);
}

/* Ripple effect for dark mode */
.dark-theme-app .ripple {
	background: radial-gradient(circle, rgba(255, 107, 107, 0.8) 0%, transparent 70%);
}

/* Spark effects for dark mode */
.dark-theme-app .spark {
	background: #ffffff;
	box-shadow: 0 0 10px rgba(255, 255, 255, 0.8), 0 0 20px rgba(255, 255, 255, 0.6);
}

/* Likers modal dark mode */
.dark-theme-app .likers-modal .MuiPaper-root {
	background: #1e1e1e;
	color: #e0e0e0;
}

.dark-theme-app .likers-modal .MuiDialogTitle-root {
	background: #2d2d2d;
	color: #e0e0e0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.dark-theme-app .likers-modal .liker-item {
	border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}

.dark-theme-app .likers-modal .liker-item:hover {
	background: rgba(255, 255, 255, 0.05);
}

.dark-theme-app .likers-modal .liker-name {
	color: #ff8c00; /* Changed from blue to orange for consistency */
}

.dark-theme-app .likers-modal .like-time {
	color: #999;
}

/* Override any blue line elements in morphing animation */
.dark-theme-app .like-button-morphing::before,
.dark-theme-app .like-button-morphing::after {
	background: #ff8c00 !important; /* Orange instead of blue */
	border-color: #ff8c00 !important;
}

/* Comment form submit button - greenish theme for dark mode */
.dark-theme-app .comment-form-submit-button {
	background: linear-gradient(135deg, #00c853 0%, #00e676 100%) !important;
	color: #ffffff !important;
	border: 1px solid #00e676 !important;
	box-shadow: 0 2px 8px rgba(0, 230, 118, 0.3) !important;
}

.dark-theme-app .comment-form-submit-button:hover:not(:disabled) {
	background: linear-gradient(135deg, #00e676 0%, #69f0ae 100%) !important;
	box-shadow: 0 4px 16px rgba(0, 230, 118, 0.5) !important;
	border-color: #69f0ae !important;
}

.dark-theme-app .comment-form-submit-button:disabled {
	background: rgba(0, 200, 83, 0.3) !important;
	color: rgba(255, 255, 255, 0.5) !important;
	border-color: rgba(0, 230, 118, 0.3) !important;
	box-shadow: none !important;
}

/* Save draft button - complementary style */
.dark-theme-app .comment-form-save-draft-button {
	background: rgba(0, 230, 118, 0.1) !important;
	color: #00e676 !important;
	border: 1px solid rgba(0, 230, 118, 0.3) !important;
}

.dark-theme-app .comment-form-save-draft-button:hover:not(:disabled) {
	background: rgba(0, 230, 118, 0.2) !important;
	border-color: #00e676 !important;
	box-shadow: 0 2px 8px rgba(0, 230, 118, 0.2) !important;
}

.dark-theme-app .comment-form-save-draft-button:disabled {
	background: rgba(0, 230, 118, 0.05) !important;
	color: rgba(0, 230, 118, 0.3) !important;
	border-color: rgba(0, 230, 118, 0.1) !important;
}

/* Like button morphing chart - make green in dark mode WITHOUT breaking animations */
/* Only change the stroke color, preserve all animation properties */
.dark-theme-app .comment-actions svg path[d*="M4 18 L6 16 L8 15"][fill="none"] {
	stroke: #00e676 !important; /* Bright green */
}

/* Make the line thicker without interfering with stroke-dasharray animation */
.dark-theme-app .comment-actions svg path[style*="strokeDasharray"][fill="none"] {
	stroke-width: 6 !important; /* Slightly thicker */
}

/* Support line during morphing */
.dark-theme-app .comment-actions svg line[stroke-dasharray="2,2"] {
	stroke: #00e676 !important;
}

/* Gradient fills for the chart area */
.dark-theme-app .comment-actions svg stop {
	stop-color: #00e676 !important;
}

/* Grid lines in the chart background - preserve opacity animation */
.dark-theme-app .comment-actions svg g line {
	stroke: #00e676 !important;
}

/* Arrow at chart peak */
.dark-theme-app .comment-actions svg g[transform*="translate(20"] path {
	stroke: #00e676 !important;
}

.dark-theme-app .comment-actions svg g[transform*="translate(20"] circle {
	fill: #00e676 !important;
}

/* Dots on the line */
.dark-theme-app .comment-actions svg circle[fill] {
	fill: #00e676 !important;
}

/* ===============================================
   DROPDOWN MENUS DARK MODE FIXES
   =============================================== */

/* Comment Sort Selector Dropdown */
.dark-theme-app .MuiPaper-root.MuiMenu-paper {
	background-color: #2d2d2d !important;
	color: #e0e0e0 !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.dark-theme-app .MuiMenuItem-root {
	color: #e0e0e0 !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}

.dark-theme-app .MuiMenuItem-root:hover {
	background-color: rgba(255, 255, 255, 0.08) !important;
}

.dark-theme-app .MuiMenuItem-root:last-child {
	border-bottom: none !important;
}

/* Sort Selector Icons and Text */
.dark-theme-app .MuiMenuItem-root .MuiBox-root {
	color: #e0e0e0 !important;
}

.dark-theme-app .MuiMenuItem-root .MuiTypography-root {
	color: #e0e0e0 !important;
}

.dark-theme-app .MuiMenuItem-root .MuiTypography-colorTextSecondary {
	color: #999 !important;
}

/* Comment Form Username Selector Dropdown */
.dark-theme-app .comment-form-username-selector .MuiSelect-root {
	background-color: rgba(255, 255, 255, 0.08) !important;
	color: #e0e0e0 !important;
	border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

.dark-theme-app .comment-form-username-selector .MuiSelect-root:hover {
	background-color: rgba(255, 255, 255, 0.12) !important;
	border-color: rgba(255, 255, 255, 0.3) !important;
}

.dark-theme-app .comment-form-username-selector .MuiSelect-root.Mui-focused {
	background-color: rgba(255, 255, 255, 0.15) !important;
	border-color: #00e676 !important;
	box-shadow: 0 0 10px rgba(0, 230, 118, 0.3) !important;
}

.dark-theme-app .comment-form-username-selector .MuiSelect-icon {
	color: #e0e0e0 !important;
}

/* Username selector dropdown items */
.dark-theme-app .comment-form-username-selector .MuiPaper-root {
	background-color: #2d2d2d !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.dark-theme-app .comment-form-username-selector .MuiMenuItem-root {
	color: #e0e0e0 !important;
}

.dark-theme-app .comment-form-username-selector .MuiMenuItem-root:hover {
	background-color: rgba(0, 230, 118, 0.1) !important;
}

/* General Select and Input dark mode fixes */
.dark-theme-app .MuiOutlinedInput-root {
	background-color: rgba(255, 255, 255, 0.08) !important;
	color: #e0e0e0 !important;
}

.dark-theme-app .MuiOutlinedInput-root:hover {
	background-color: rgba(255, 255, 255, 0.12) !important;
}

.dark-theme-app .MuiOutlinedInput-root.Mui-focused {
	background-color: rgba(255, 255, 255, 0.15) !important;
	border-color: #00e676 !important;
}

.dark-theme-app .MuiOutlinedInput-notchedOutline {
	border-color: rgba(255, 255, 255, 0.2) !important;
}

.dark-theme-app .MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline {
	border-color: rgba(255, 255, 255, 0.3) !important;
}

.dark-theme-app .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline {
	border-color: #00e676 !important;
}

/* Select dropdown arrow */
.dark-theme-app .MuiSelect-icon {
	color: #e0e0e0 !important;
}

/* ===============================================
   MATERIAL-UI TOOLTIP DARK MODE FIXES
   =============================================== */

/* Fix Material-UI Tooltip components that render in portals */
.dark-theme-app .MuiTooltip-tooltip {
	background-color: #2d2d2d !important;
	color: #e0e0e0 !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.6) !important;
	font-size: 0.875rem !important;
}

/* Tooltip arrow styling for dark mode */
.dark-theme-app .MuiTooltip-arrow {
	color: #2d2d2d !important;
}

/* Popper component that Material-UI tooltips use */
.dark-theme-app .MuiTooltip-popper {
	z-index: 9999 !important;
}

/* Fix for tooltips with custom Paper components */
.dark-theme-app .MuiTooltip-tooltip .MuiPaper-root {
	background-color: #2d2d2d !important;
	color: #e0e0e0 !important;
}

/* Typography inside tooltips */
.dark-theme-app .MuiTooltip-tooltip .MuiTypography-root {
	color: #e0e0e0 !important;
}

/* Box components inside tooltips */
.dark-theme-app .MuiTooltip-tooltip .MuiBox-root {
	color: #e0e0e0 !important;
}

/* Circular progress indicator inside tooltips */
.dark-theme-app .MuiTooltip-tooltip .MuiCircularProgress-root {
	color: #42a5f5 !important;
}

/* Any nested text elements in tooltips */
.dark-theme-app .MuiTooltip-tooltip * {
	color: #e0e0e0 !important;
}

/* Force dark styling on any Popper that appears when dark mode is active */
html.dark-theme-app .MuiTooltip-tooltip {
	background-color: #2d2d2d !important;
	color: #e0e0e0 !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.6) !important;
}

html.dark-theme-app .MuiTooltip-tooltip * {
	color: #e0e0e0 !important;
}

html.dark-theme-app .MuiTooltip-arrow {
	color: #2d2d2d !important;
}

/* ===============================================
   BLOG ELEMENTS BORDER FIXES
   =============================================== */

/* Prevent unwanted borders on blog post elements */
.dark-theme-app .blog-post-item .MuiBox-root,
.dark-theme-app .blog-container .MuiBox-root,
.dark-theme-app .blog-post-content .MuiBox-root {
	border: none !important;
	border-color: transparent !important;
}

/* Prevent borders on comment actions and general MUI boxes in blog area */
.dark-theme-app .comment-actions .MuiBox-root,
.dark-theme-app .comments-section .MuiBox-root,
.dark-theme-app .MuiBox-root {
	border: none !important;
}

/* ===============================================
   MUI OUTLINED BUTTONS IN DIALOGS
   =============================================== */

.dark-theme-app .MuiDialog-paper .MuiButton-outlined {
	color: #ffffff;
	border-color: rgba(255, 255, 255, 0.5);
}
.dark-theme-app .MuiDialog-paper .MuiButton-outlined:hover {
	border-color: #ffffff;
	background-color: rgba(255, 255, 255, 0.08);
}
.dark-theme-app .MuiDialog-paper .MuiIconButton-root {
	color: #ffffff;
}
