/*!
 * Jodit Editor (https://xdsoft.net/jodit/)
 * Released under MIT see LICENSE.txt in the project root for license information.
 * Copyright (c) 2013-2024 Valeriy Chupurnov. All rights reserved. https://xdsoft.net
 */

@import (reference) '../../../styles/variables';
@import (reference) '../../../styles/mixins';

.jodit-tabs {
	--box-shadow-tabs: 0 0 #0000, 0 1px 3px 0 rgba(0, 0, 0, 0.1),
		0 1px 2px -1px rgba(0, 0, 0, 0.1);

	.font();

	.jodit-tabs__buttons {
		background-color: var(--color-background-light-gray);
		display: flex;
		justify-content: center;
		margin-top: calc(var(--padding-default) / 2);
		margin-bottom: var(--padding-default);
		padding: calc(var(--padding-default) / 2);
		border-radius: var(--border-radius-default);

		.jodit-ui-button {
			color: var(--color-placeholder);
			svg {
				fill: var(--color-placeholder);
			}
		}

		.jodit-ui-button:active:not([disabled]),
		.jodit-ui-button[aria-pressed='true']:not([disabled]) {
			&,
			.jodit-ui-button__text {
				background-color: var(--color-background-default);
			}
			box-shadow: var(--box-shadow-tabs);
			color: var(--color-text-icons);
			svg {
				fill: var(--color-text-icons);
			}
		}

		> * {
			margin-left: calc(var(--padding-default) / 2);
			cursor: pointer;

			&:only-of-type {
				width: 100%;
			}

			&:first-child {
				margin-left: 0;
			}
		}

		@media (max-width: @screen-xs) {
			display: block;

			> * {
				width: 100%;
				margin-left: 0;
			}
		}
	}

	&__button {
		min-width: 80px;
		max-width: 210px;

		.jodit-ui-button__text {
			white-space: nowrap;
			flex: 1;
			justify-content: space-around;
		}

		&_columns_3 {
			width: calc(100% / 3);
		}

		&_columns_2 {
			width: 50%;
		}
	}

	.jodit-tabs__wrapper {
		.jodit-tab {
			display: none;

			&.jodit-tab_active {
				display: block;
			}

			&.jodit-tab_empty {
				min-width: 220px;
				min-height: 100px;
			}
		}
	}
}

.jodit-dialog_theme_dark,
.jodit_theme_dark {
	.jodit-tabs {
		.jodit-tabs__buttons {
			background-color: var(--dark-background-color);
			border-radius: var(--border-radius-default);

			.jodit-ui-button:active:not([disabled]),
			.jodit-ui-button[aria-pressed='true']:not([disabled]) {
				//background-color: transparent;
				.jodit-ui-button__text {
					color: var(--dark-toolbar-color);
				}
				svg {
					fill: var(--color-text-icons);
				}
			}
		}
	}
}
