@charset "utf-8";

html,
[data-theme="light"] {
	--color-1: #f5f5f5;
	--color-2: #e5e5e5;
	--color-3: #ffffff;
	--text-color-1: #444444;
	--text-color-2: #3d3d3d;
	--text-color-3: #000000;
	--links-color: var(--text-color-1);
	--h2-color: var(--text-color-1);
	--bg1-color: var(--color-1);
	--bg2-color: var(--color-1);
	--bg3-color: var(--color-1);
	--input-bg: #ffffff;
	--input-txt-color: #333333;
	--border-color-1: #b8b5b5;
	--border-color-2: #c7c3bf;
	--border-color-3: var(--color-1);
	--color-warning: #ffe799;
	--color-error: #e60a4c;
	--filter-1: none;
	--filter-2: none;
	--switch-light-dark: "\f186";
	--shadowcolor: rgba(0, 0, 0, 0.35);
}

@media (prefers-color-scheme: dark) {
	html {
		--color-1: #1d232e;
		--color-2: #242b36;
		--color-3: #131a24;
		--color-bg: #424851;
		--text-color-1: #d9e2e4;
		--text-color-2: #cccccc;
		--text-color-3: #ffffff;
		--links-color: var(--text-color-1);
		--h2-color: var(--text-color-1);
		--bg1-color: var(--color-1);
		--bg2-color: var(--color-1);
		--bg3-color: var(--color-1);
		--input-bg: #131a24;
		--input-txt-color: #ffffff;
		--border-color-1: #333333;
		--border-color-2: #777f85;
		--border-color-3: var(--color-1);
		--color-warning: #ffe799;
		--color-error: #c90842;
		--filter-1: saturate(150%);
		--filter-2: brightness(160%);
		--switch-light-dark: "\f0eb";
		--shadowcolor: rgba(0, 0, 0, 0.55);
	}
}

[data-theme="dark"] {
	--color-1: #1d232e;
	--color-2: #242b36;
	--color-3: #131a24;
	--text-color-1: #d9e2e4;
	--text-color-2: #cccccc;
	--text-color-3: #ffffff;
	--links-color: var(--text-color-1);
	--h2-color: var(--text-color-1);
	--bg1-color: var(--color-1);
	--bg2-color: var(--color-1);
	--bg3-color: var(--color-1);
	--input-bg: #131a24;
	--input-txt-color: #ffffff;
	--border-color-1: #333333;
	--border-color-2: #777f85;
	--border-color-3: var(--color-1);
	--color-warning: #ffe799;
	--color-error: #c90842;
	--filter-1: saturate(150%);
	--filter-2: brightness(160%);
	--switch-light-dark: "\f0eb";
	--shadowcolor: rgba(0, 0, 0, 0.55);
}

html,
body {
	background-color: var(--color-3);
	color: var(--text-color-2);
}

h2 {
	color: var(--text-color-1);
}

h3 {
	border-bottom-color: var(--border-color-2);
	color: var(--text-color-2);
}

hr {
	border-color: var(--color-3);
	border-top-color: var(--border-color-2);
}

a {
	color: var(--links-color);
}

.switch-theme i::before {
	content: var(--switch-light-dark);
}

.forumbg .header a:hover,
.forabg .header a:hover,
th a:hover {
	color: #ffffff;
}

.dropdown-extended a.mark_read {
	background-color: var(--color-1);
}

.postlink,
.postlink:visited {
	border-bottom-color: var(--links-color);
	color: var(--links-color);
}

.postlink:hover {
	background-color: var(--color-1);
}

.wrap {
	background-color: var(--color-3);
}

.navbar {
	background-color: var(--color-2);
}

.scrolled .sticky-nav {
	box-shadow: 0 2px 4px -1px var(--shadowcolor);
}

.post:target .content {
	color: var(--text-color-3);
}

.post h3 a.first-unread,
.post:target h3 a {
	color: var(--text-color-3);
}

.bg1,
.bg1:hover {
	background-color: var(--bg1-color);
}

table.zebra-list tr:nth-child(odd) td,
ul.zebra-list li:nth-child(odd) {
	background-color: var(--bg1-color);
}

.bg2,
.bg2:hover {
	background-color: var(--bg2-color);
}

table.zebra-list tr:nth-child(even) td,
ul.zebra-list li:nth-child(even) {
	background-color: var(--bg2-color);
}

.bg3 {
	background-color: var(--bg3-color);
}

.panel {
	color: var(--text-color-1);
	background-color: var(--color-1);
}

.username-coloured,
.group-coloured,
.is-colored {
	filter: var(--filter-1);
}

table.table1 td {
	color: var(--text-color-1);
}

table.table1 tbody td {
	border-bottom-color: var(--input-bg);
}

table.table1 tbody tr {
	border-color: var(--input-bg);
}

table.table1 tbody tr:hover,
table.table1 tbody tr:hover,
table.table1 td:hover {
	background-color: var(--color-3);
	color: var(--text-color-1);
}

dl.details dt {
	color: var(--text-color-3);
}

dl.details dd {
	color: var(--text-color-1);
}

.icon.icon-blue,
a:hover .icon.icon-blue,
.icon.icon-green,
a:hover .icon.icon-green,
.icon.icon-red,
a:hover .icon.icon-red,
.icon.icon-orange,
a:hover .icon.icon-orange,
.icon.icon-bluegray,
a:hover .icon.icon-bluegray,
.icon.icon-gray,
a:hover .icon.icon-gray,
.icon.icon-lightgray,
a:hover .icon.icon-lightgray {
	color: var(--links-color);
}

.icon.icon-black,
a:hover .icon.icon-black {
	color: var(--text-color-2);
}

.jumpbox-forum-link {
	background-color: var(--color-1);
}

.jumpbox-forum-link:hover {
	background-color: var(--color-1);
}

.jumpbox .dropdown .pointer-inner {
	border-color: var(--color-1) transparent;
}

.jumpbox-sub-link {
	background-color: var(--color-1);
}

.jumpbox-sub-link:hover {
	background-color: var(--color-2);
}

.error {
	background-color: var(--color-warning);
}

li.reported:hover {
	background-color: var(--color-2) !important;
}

div.rules {
	background-color: var(--border-color-3);
	color: var(--text-color-1);
}

p.post-notice {
	background-color: var(--border-color-3);
}

ul.forums {
	background-color: var(--color-1);
}

ul.topiclist li {
	color: var(--text-color-1);
}

ul.topiclist dd {
	border-left-color: var(--color-3);
}

.rtl ul.topiclist dd {
	border-right-color: var(--color-3);
}

li.row {
	border-bottom-color: var(--color-2);
}

li.row strong {
	color: var(--text-color-3);
}

li.row:hover {
	background-color: var(--color-2);
}

li.row:hover dd {
	border-left-color: var(--color-2);
}

.row-item[class*="_unread"]::before {
	color: #fff;
}

.postbody {
	color: var(--text-color-2);
}

.content {
	color: var(--text-color-2);
}

.content h2,
.panel h2 {
	color: var(--text-color-1);
	border-bottom-color: var(--border-color-3);
}

dl.faq dt {
	color: var(--text-color-2);
}

.signature {
	border-top-color: var(--border-color-2);
}

blockquote {
	background-color: var(--color-3);
	border-color: var(--color-2);
}

blockquote blockquote {
	background-color: var(--color-1);
}

blockquote blockquote blockquote {
	background-color: var(--color-3);
}

.codebox {
	background-color: var(--color-3);
	border-color: var(--border-color-1);
}

.codebox p {
	border-bottom-color: var(--border-color-1);
}

.codebox code {
	filter: var(--filter-2);
}

code::selection {
	background-color: var(--color-3);
}

.postprofile {
	color: var(--text-color-2);
	border-color: var(--color-3);
}

.pm .postprofile {
	border-color: var(--color-2);
}

.postprofile strong {
	color: var(--text-color-3);
}

fieldset.polls dl {
	border-top-color: var(--border-color-1);
	color: var(--text-color-2);
}

fieldset.polls dl.voted {
	color: var(--text-color-3);
}

.button {
	color: #ffffff;
}

.button:hover,
.button:focus {
	color: #ffffff;
}

.button .icon,
.button-secondary {
	color: #ffffff;
}

.button-secondary:focus,
.button-secondary:hover,
.button:focus .icon,
.button:hover .icon {
	color: #ffffff;
}

.caret {
	border-color: #ffffff;
}

[dir="rtl"] .rtl .caret {
	border-right-color: #ffffff;
}

.contact-icons a {
	background-color: var(--color-3);
}

.contact-icons a:hover {
	background-color: var(--color-3);
}

.pagination li a {
	color: #ffffff;
}

.pagination li.ellipsis span {
	color: var(--text-color-1);
}

.search-box .inputbox,
.search-box .inputbox:hover,
.search-box .inputbox:focus {
	border-color: var(--border-color-2);
}


.panel-container h3,
.panel-container hr,
.cp-menu hr {
	border-color: var(--border-color-2);
}

.panel-container .panel li.row {
	border-bottom-color: var(--color-1);
	border-top-color: transparent;
}

ul.cplist {
	border-top-color: var(--color-1);
}

.panel-container .panel li.header dd,
.panel-container .panel li.header dt {
	color: var(--text-color-3);
}

.panel-container table.table1 thead th {
	color: var(--text-color-2);
	border-bottom-color: var(--text-color-2);
}

.cp-main .pm-message {
	border-color: #212121;
	background-color: var(--color-1);
}

.current {
	color: var(--text-color-3) !important;
}

.tabs .tab > a {
	color: #ffffff;
}

.tabs .tab > a:hover {
	color: #ffffff;
}

.tabs .activetab > a,
.tabs .activetab > a:hover {
	color: #ffffff;
}

.minitabs .tab > a {
	color: #ffffff;
}

.minitabs .tab > a:hover,
.minitabs .activetab > a,
.minitabs .activetab > a:hover {
	color: #ffffff;
}

.responsive-tab .responsive-tab-link:before,
.responsive-tab .responsive-tab-link:hover:before {
	border-color: #ffffff;
}

.navigation a,
.rtl .navigation a,
.navigation a:hover,
.navigation a:active,
.navigation .active-subsection a,
.navigation .active-subsection a:hover,
.navigation .active-subsection a:active {
	color: #ffffff;
}

@media (max-width: 900px) {

	.navigation a:hover,
	.navigation .active-subsection a,
	.navigation .active-subsection a:hover {
		color: #ffffff;
	}
}

.panel-container .panel {
	background-color: var(--color-2);
}

.cp-main .pm {
	background-color: var(--color-3);
}

.cp-mini {
	background-color: var(--color-1);
}

dl.mini dt {
	color: var(--text-color-1);
}

label {
	color: var(--text-color-2);
}

select {
	border-color: #464646;
	background-color: var(--input-bg);
	color: var(--input-txt-color);
}

dd label {
	color: var(--text-color-2);
}

fieldset dl:hover dt label {
	color: var(--text-color-3);
}

fieldset.quick-login input.inputbox {
	background-color: var(--input-bg);
}

input[type="checkbox"],
input[type="radio"] {
	color: #ffffff;
	background-color: var(--input-bg);
	border: 1px solid var(--border-color-2);
}

.message-box textarea {
	color: var(--input-txt-color);
}

.inputbox,
input {
	background-color: var(--input-bg);
	border-color: var(--border-color-2);
	color: var(--input-txt-color);
}

.inputbox::placeholder {
	color: var(--text-color-2);
}

.warning,
.inputbox.warning:hover {
	border-color: var(--color-warning);
}

a.button1,
a.button2,
input.button1,
input.button2,
input.button3 {
	color: #ffffff;
}

a.button1:hover,
a.button2:hover,
input.button1:hover,
input.button1:focus,
input.button2:hover,
input.button2:focus,
input.button3:hover,
input.button3:focus {
	color: #ffffff;
}

.dropdown-extended ul li {
	border-top-color: var(--border-color-3);
}

.dropdown-extended ul li:hover {
	background-color: var(--color-1);
	color: #e5e5e5;
}

.dropdown-extended .header,
.dropdown-extended .footer {
	border-color: var(--border-color-3);
}

.dropdown-extended .header {
	background: var(--color-1);
}

.dropdown-extended .pointer-inner {
	border-color: var(--color-1) transparent;
}

.dropdown .pointer {
	border-color: var(--border-color-2) transparent;
}

.dropdown .pointer-inner {
	border-color: var(--color-3) transparent;
}

.dropdown-extended .pointer-inner {
	border-color: var(--color-1) transparent;
}

.dropdown .dropdown-contents {
	background: var(--color-3);
	border-color: var(--border-color-2);
	box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.2);
}

.dropdown li.separator {
	border-color: var(--border-color-2);

}

li.notification-reported strong,
li.notification-disapproved strong {
	color: var(--color-error);
}

.notification_list p.notification-time {
	color: var(--text-color-2);
}

.copyright,
.footerbar a,
.footerbar a:hover,
.footerbar a:focus,
.footerbar a:active {
	color: #ffffff;
}

.dropdown-extended .notification-block .fa-user {
	color: #444444;
}

fieldset.quick-login {
	background-color: var(--color-1);
	border-bottom: 1px solid var(--color-1);
}

fieldset.quick-login:hover {
	background-color: var(--color-1);
}

.stat-block {
	background-color: var(--color-1);
	border-bottom: 1px solid var(--color-2);
}

.stat-block h3,
.stat-block h3 a {
	color: var(--text-color-3);
}

.member-search .current-search {
	border-color: var(--links-color);
}

@media (prefers-color-scheme: dark) {
	.stat-content em a[style*="color:"] {
		filter: var(--filter-1);
	}
}

[data-theme="dark"] .stat-content em a[style*="color:"] {
	filter: var(--filter-1);
}

.socialinks-list-item {
	color: #ffffff;
}

.phpbb_alert {
	background-color: var(--color-1);
	border-color: var(--border-color-1);
}

.rtl li.row:hover dd {
	border-right-color: var(--color-1);
}

#showpass-btn {
	color: var(--input-txt-color);
}

.scrolltop,
.scrolltop:hover,
.scrolltop:focus {
	color: #fff;
}

.avatar-letter {
	background-color: var(--color-2);
}

a.avatar-letter:hover,
a.avatar-letter:focus,
a.avatar-letter:active {
	color: var(--links-color);
}

.sp-container {
	background-color: var(--color-3);
	border: 1px solid var(--border-color-2);
	box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.2);
}

.sp-container .sp-input {
	background-color: var(--input-bg);
	color: var(--input-txt-color);
	border: 1px solid var(--border-color-1) !important;
}

.damaio .cc-message {
	color: var(--text-color-2);
}

.damaio .cc-banner .cc-link {
	color: var(--links-color);
}

/* || Tweaks for phpBB official extensions
--------------------------------------------------------------------------- */

/* Board Annoucements */
.damaio .phpbb_announcement {
	background-color: var(--color-1);
}

/* Board Rules */
.damaio .highlight {
	background-color: var(--color-2);
}
