/* Сброс отступов и базовая модель блока */

html, body {
	margin: 0;
	padding: 0;
}

* {
	box-sizing: border-box;
}

/* Базовая типографика страницы */

body {
	font-family: 'Segoe UI', Tahoma, Arial, sans-serif;
	font-size: 15px;
	line-height: 1.55;
	color: #1f2937;
	background-color: #f3f4f6;
}

/* Универсальная скрытие элементов */

.hidden-element {
	display: none !important;
}

/* Кнопки основного действия */

.primary-button {
	display: inline-block;
	padding: 10px 18px;
	border: none;
	border-radius: 8px;
	background-color: #2563eb;
	color: #ffffff;
	font-family: inherit;
	font-size: 15px;
	cursor: pointer;
}

.primary-button:hover {
	background-color: #1d4ed8;
}

.primary-button:disabled {
	background-color: #93c5fd;
	cursor: default;
}

/* Кнопки второстепенного действия */

.ghost-button {
	display: inline-block;
	padding: 9px 16px;
	border: 1px solid #d1d5db;
	border-radius: 8px;
	background-color: #ffffff;
	color: #4b5563;
	font-family: inherit;
	font-size: 14px;
	cursor: pointer;
}

.ghost-button:hover {
	background-color: #f9fafb;
	border-color: #9ca3af;
}

/* Кнопка без фона только с иконкой */

.icon-only-button {
	display: inline-block;
	padding: 6px;
	border: none;
	border-radius: 8px;
	background-color: transparent;
	cursor: pointer;
}

.icon-only-button:hover {
	background-color: #e5e7eb;
}

/* Круглая кнопка действия в поле ввода */

.round-icon-button {
	width: 42px;
	height: 42px;
	flex: 0 0 auto;
	display: block;
	border: none;
	border-radius: 50%;
	background-color: #2563eb;
	cursor: pointer;
	padding: 0;
}

.round-icon-button:hover {
	background-color: #1d4ed8;
}

.round-icon-button:disabled {
	background-color: #93c5fd;
	cursor: default;
}

/* Группа кнопки микрофона со стрелкой режима */

.voice-button-group {
	position: relative;
	flex: 0 0 auto;
	width: 42px;
	height: 42px;
}

/* Маленькая кнопка-стрелка рядом с круглой кнопкой */

.small-arrow-button {
	width: 20px;
	height: 20px;
	display: block;
	position: absolute;
	right: -8px;
	bottom: -4px;
	border: 2px solid #f3f4f6;
	border-radius: 50%;
	background-color: #e5e7eb;
	cursor: pointer;
	padding: 0;
	z-index: 2;
}

.small-arrow-button:hover {
	background-color: #d1d5db;
}

/* Иконки внутри кнопок */

.button-icon {
	width: 18px;
	height: 18px;
	vertical-align: -3px;
	margin-right: 6px;
}

.action-icon {
	width: 22px;
	height: 22px;
	display: block;
	margin: 0 auto;
}

.arrow-icon {
	width: 14px;
	height: 14px;
	display: block;
	margin: 0 auto;
}

.header-icon {
	width: 24px;
	height: 24px;
	display: block;
}

/* Поля ввода текста */

.text-input-base {
	padding: 10px 12px;
	border: 1px solid #d1d5db;
	border-radius: 8px;
	background-color: #ffffff;
	color: #1f2937;
	font-family: inherit;
	font-size: 15px;
}

.text-input-base:focus {
	outline: none;
	border-color: #2563eb;
}

/* Выпадающие списки настроек */

.select-base {
	padding: 8px 10px;
	border: 1px solid #d1d5db;
	border-radius: 8px;
	background-color: #ffffff;
	color: #374151;
	font-family: inherit;
	font-size: 14px;
	max-width: 100%;
}

.select-base:focus {
	outline: none;
	border-color: #2563eb;
}

/* Сообщения об ошибках */

.error-text {
	color: #dc2626;
	font-size: 14px;
}