<commit_before>/** ----------------------------------------------------------------------------
 * Derivative colours (fixed variants of inherited variables)
 */

@default-action-color: darken(@secondary-background-color, 15%);
@default-action-contrast: contrast(@default-action-color, #444);
@primary-background-contrast: contrast(@primary-background-color, #444);
@primary-action-contrast: contrast(@primary-action-color, #444);
@secondary-action-contrast: contrast(@secondary-action-color, #444);
@selection-background: lighten(@selection-color, 30%);
@success-background: lighten(@success-color, 45%);
@success-border: lighten(@success-color, 30%);
@error-background: lighten(@error-color, 45%);
@error-border: lighten(@error-color, 30%);
@error-contrast: contrast(@error-color);
@pending-background: lighten(@pending-color, 45%);
@pending-border: lighten(@pending-color, 30%);
@window-border-color: @component-color;

/** ----------------------------------------------------------------------------
 * Document components
 */

html {
	.custom-scroll(@transparent-dark, @custom-scrollbar-color, 0);
}

* {
	.custom-scroll(@transparent-dark, @custom-scrollbar-color);
}

body {
	color: @primary-font-color;
	* {
		border-color: @component-color;
	}
}

code {
	background-color: @transparent-dark;
	border-color: @component-color;
	color: @secondary-font-color;
}

blockquote:before {
	background-color: @transparent-darker;
}

.main-content,
.cms-page,
.page-container {
	background-color: @content-background-color;
	header {
		background-color: @content-background-color;
		border-color: @component-color;
	}
}

.page-container table {
	overflow: hidden;
	background-color: @secondary-background-color;
	th,
	td {
		border-color: @component-color;
	}
	th {
		background-color: @content-background-color;
	}
	tr {
		background-color: @transparent-light;
		&:nth-of-type(even) {
			background-color: @transparent-lightest;
		}
	}
	tr:hover td {
		background-color: @content-background-color;
	}
}

.burger i {
	background-color: @primary-font-color;
}


/** ----------------------------------------------------------------------------
 * Admin and settings styles
 */

.page-settings {
	.content {
		background-color: @transparent-dark;
	}
	.section {
		background-color: @content-background-color;
	}
	.terminal {
		background-color: #444;
		color: white;
		.time {
			color: @secondary-font-color;
		}
	}
}

.page-list,
.page-settings {
	a {
		color: @primary-font-color;
		&:hover {
			color: @primary-action-color;
		}
	}
}

.settings-file-preview .preview.no-file {
	background-color: @transparent-light;
	color: @secondary-font-color;
}

.new-logs {
	background: @primary-action-contrast;
	color: @primary-action-color;
}

.code-error-box {
	.title {
		background-color: @error-color;
		color: white;
	}
	pre {
		color: @error-color;
		border-color: @error-border;
		background-color: @transparent-lightest;
	}
}

.code-mirror-box {
	.buttons {
		background-color: #f7f7f7; // matches plugin styles
	}
	&.code-mirror-box-fullscreen {
		background-color: @content-background-color;
	}
}

.avatar-suggestion-item {
	background-color: @tertiary-background-color;
	.avatar {
		background-size: cover;
		background-color: @tertiary-background-color;
	}
	.question-mark::before {
		color: @secondary-font-color;
	}
}


/** ----------------------------------------------------------------------------
 * Asides (external to main application views)
 */

.spotlight {
	background-color: @transparent-darker;
	> .spotlight-input {
		background-color: @secondary-background-color;
		color: @secondary-font-color;
		> i {
			color: @secondary-font-color;
		}
	}
}

.mobile-message-menu {
	background-color: @transparent-dark;
}

.full-page,
.page-loading {
	.gradient(shade(@primary-background-color), @primary-background-color);
	color: @tertiary-font-color;
	a {
		color: @tertiary-font-color;
	}
	a:hover {
		color: @primary-background-contrast;
	}
	.spinner > div {
		background-color: @primary-background-contrast;
	}
}

#login-card {
	color: @primary-font-color;
	background-color: @content-background-color;
	.input-shade(@primary-font-color, @content-background-color);
}

.dropzone.over .dropzone-overlay {
	background-color: @transparent-darkest;
	color: @content-background-color;
	> div {
		background-color: @transparent-darkest;
	}
}


/** ----------------------------------------------------------------------------
 * Room components
 */

.new-message {
	color: @primary-action-contrast;
	background-color: @primary-action-color;
}

.ticks-bar {
	.tick {
		background-color: @primary-action-color;
	}
	.tick-all {
		background-color: @selection-color;
	}
}

.room-not-found {
	color: @error-color;
}

.favorite-room {
	color: @pending-color;
}

.toggle-favorite {
	color: @component-color;
}

.container-bars {
	.upload-progress {
		background-color: @component-color;
		color: @primary-action-color;
		&.upload-error {
			background-color: @error-background;
			border-color: @error-border;
		}
		.upload-progress-progress {
			background-color: @success-background;
		}
	}
	.unread-bar {
		background-color: @component-color;
		color: @primary-action-color;
	}
}

.messages-container {
	.edit-room-title {
		.linkColors(@secondary-font-color, @primary-font-color);
	}
	.footer {
		background: @content-background-color;
	}
	.message-form {
		color: @secondary-font-color;
		.input-message-container {
			background-color: @content-background-color;
		}
		.message-buttons {
			.buttonColors(lighten(@primary-font-color, 25%), @secondary-background-color);
		}
	}
	.new-message {
		color: @primary-action-contrast;
		background-color: @primary-action-color;
	}
	.messages-box {
		.jump-recent {
			background-color: @component-color;
		}
		&.selectable .selected {
			background-color: @selection-background;
		}
		.load-more span {
			background-color: @secondary-background-color;
		}
	}
}

.message-popup {
	background: @content-background-color;
}

.message-popup-title {
	background-color: @secondary-background-color;
	// border-bottom-color: #E7E7E7;
}

.popup-item {
	// color: @secondary-font-color;
	&.selected {
		color: @primary-action-contrast;
		background-color: @primary-action-color;
	}
	span {
		color: @secondary-font-color;
	}
}

.messages-box {
	.start {
		color: @info-font-color;
	}
	.editing .body,
	textarea.editing {
		background-color: @selection-background;
	}
}


/** ----------------------------------------------------------------------------
 * Message content
 */

.first-unread {
	.body {
		&::before {
			background: @transparent-darker;
		}
		&::after {
			color: @primary-font-color;
		}
	}
}

.first-unread-opaque {
	.body {
		&::before {
			background: @transparent-dark;
		}
	}
}

.message {
	.body {
		color: @primary-font-color;<commit_msg>fix message editing highlight color<commit_after>/** ----------------------------------------------------------------------------
 * Derivative colours (fixed variants of inherited variables)
 */

@default-action-color: darken(@secondary-background-color, 15%);
@default-action-contrast: contrast(@default-action-color, #444);
@primary-background-contrast: contrast(@primary-background-color, #444);
@primary-action-contrast: contrast(@primary-action-color, #444);
@secondary-action-contrast: contrast(@secondary-action-color, #444);
@selection-background: lighten(@selection-color, 30%);
@success-background: lighten(@success-color, 45%);
@success-border: lighten(@success-color, 30%);
@error-background: lighten(@error-color, 45%);
@error-border: lighten(@error-color, 30%);
@error-contrast: contrast(@error-color);
@pending-background: lighten(@pending-color, 45%);
@pending-border: lighten(@pending-color, 30%);
@window-border-color: @component-color;

/** ----------------------------------------------------------------------------
 * Document components
 */

html {
	.custom-scroll(@transparent-dark, @custom-scrollbar-color, 0);
}

* {
	.custom-scroll(@transparent-dark, @custom-scrollbar-color);
}

body {
	color: @primary-font-color;
	* {
		border-color: @component-color;
	}
}

code {
	background-color: @transparent-dark;
	border-color: @component-color;
	color: @secondary-font-color;
}

blockquote:before {
	background-color: @transparent-darker;
}

.main-content,
.cms-page,
.page-container {
	background-color: @content-background-color;
	header {
		background-color: @content-background-color;
		border-color: @component-color;
	}
}

.page-container table {
	overflow: hidden;
	background-color: @secondary-background-color;
	th,
	td {
		border-color: @component-color;
	}
	th {
		background-color: @content-background-color;
	}
	tr {
		background-color: @transparent-light;
		&:nth-of-type(even) {
			background-color: @transparent-lightest;
		}
	}
	tr:hover td {
		background-color: @content-background-color;
	}
}

.burger i {
	background-color: @primary-font-color;
}


/** ----------------------------------------------------------------------------
 * Admin and settings styles
 */

.page-settings {
	.content {
		background-color: @transparent-dark;
	}
	.section {
		background-color: @content-background-color;
	}
	.terminal {
		background-color: #444;
		color: white;
		.time {
			color: @secondary-font-color;
		}
	}
}

.page-list,
.page-settings {
	a {
		color: @primary-font-color;
		&:hover {
			color: @primary-action-color;
		}
	}
}

.settings-file-preview .preview.no-file {
	background-color: @transparent-light;
	color: @secondary-font-color;
}

.new-logs {
	background: @primary-action-contrast;
	color: @primary-action-color;
}

.code-error-box {
	.title {
		background-color: @error-color;
		color: white;
	}
	pre {
		color: @error-color;
		border-color: @error-border;
		background-color: @transparent-lightest;
	}
}

.code-mirror-box {
	.buttons {
		background-color: #f7f7f7; // matches plugin styles
	}
	&.code-mirror-box-fullscreen {
		background-color: @content-background-color;
	}
}

.avatar-suggestion-item {
	background-color: @tertiary-background-color;
	.avatar {
		background-size: cover;
		background-color: @tertiary-background-color;
	}
	.question-mark::before {
		color: @secondary-font-color;
	}
}


/** ----------------------------------------------------------------------------
 * Asides (external to main application views)
 */

.spotlight {
	background-color: @transparent-darker;
	> .spotlight-input {
		background-color: @secondary-background-color;
		color: @secondary-font-color;
		> i {
			color: @secondary-font-color;
		}
	}
}

.mobile-message-menu {
	background-color: @transparent-dark;
}

.full-page,
.page-loading {
	.gradient(shade(@primary-background-color), @primary-background-color);
	color: @tertiary-font-color;
	a {
		color: @tertiary-font-color;
	}
	a:hover {
		color: @primary-background-contrast;
	}
	.spinner > div {
		background-color: @primary-background-contrast;
	}
}

#login-card {
	color: @primary-font-color;
	background-color: @content-background-color;
	.input-shade(@primary-font-color, @content-background-color);
}

.dropzone.over .dropzone-overlay {
	background-color: @transparent-darkest;
	color: @content-background-color;
	> div {
		background-color: @transparent-darkest;
	}
}


/** ----------------------------------------------------------------------------
 * Room components
 */

.new-message {
	color: @primary-action-contrast;
	background-color: @primary-action-color;
}

.ticks-bar {
	.tick {
		background-color: @primary-action-color;
	}
	.tick-all {
		background-color: @selection-color;
	}
}

.room-not-found {
	color: @error-color;
}

.favorite-room {
	color: @pending-color;
}

.toggle-favorite {
	color: @component-color;
}

.container-bars {
	.upload-progress {
		background-color: @component-color;
		color: @primary-action-color;
		&.upload-error {
			background-color: @error-background;
			border-color: @error-border;
		}
		.upload-progress-progress {
			background-color: @success-background;
		}
	}
	.unread-bar {
		background-color: @component-color;
		color: @primary-action-color;
	}
}

.messages-container {
	.edit-room-title {
		.linkColors(@secondary-font-color, @primary-font-color);
	}
	.footer {
		background: @content-background-color;
	}
	.message-form {
		color: @secondary-font-color;
		.input-message-container {
			background-color: @content-background-color;
		}
		.message-buttons {
			.buttonColors(lighten(@primary-font-color, 25%), @secondary-background-color);
		}
		textarea {
			&.editing {
				background-color: lighten(@pending-color, 40%);
			}
		}
	}
	.new-message {
		color: @primary-action-contrast;
		background-color: @primary-action-color;
	}
	.messages-box {
		.jump-recent {
			background-color: @component-color;
		}
		&.selectable .selected {
			background-color: @selection-background;
		}
		.load-more span {
			background-color: @secondary-background-color;
		}
	}
}

.message-popup {
	background: @content-background-color;
}

.message-popup-title {
	background-color: @secondary-background-color;
	// border-bottom-color: #E7E7E7;
}

.popup-item {
	// color: @secondary-font-color;
	&.selected {
		color: @primary-action-contrast;
		background-color: @primary-action-color;
	}
	span {
		color: @secondary-font-color;
	}
}

.messages-box {
	.start {
		color: @info-font-color;
	}
	.editing .body,
	textarea.editing {
		background-color: lighten(@pending-color, 40%);
	}
}


/** ----------------------------------------------------------------------------
 * Message content
 */

.first-unread {
	.body {
		&::before {
			background: @transparent-darker;
		}
		&::after {
			color: @primary-font-color;
		}
	}
}

.first-unread-opaque {
	.body {
		&::before {
			background: @transparent-dark;
		}
	}
}

.message {
	.body {
		color: @primary-font-color;
{'fraction_non_alphanumeric': 0.22078774617067834, 'fraction_numerical': 0.00612691466083151, 'mean_word_length': 2.8406162464985996, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 11, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2277853', 'n_tokens_mistral': 4971, 'n_tokens_neox': 4629, 'n_words': 719}