/* Стили для текстовых полей ввода */

.form-control,
.text-input {
	display: inline-block; /* Отображение в строку */
	padding: 10px; /* Внутренние отступы */
	border: solid 1px #ccc; /* Рамка вокруг поля */
	border-radius: 15px; /* Закругленные углы */
	background-color: #f0f0f0; /* Цвет фона */
	transition: background-color 0.3s; /* Плавный переход цвета фона */
}
.text-input:focus {
	background-color: #e0e0e0; /* Цвет фона при фокусе */
/*     outline: none; Убираем обводку */
}
.text-input-code {
	width: 120px; /* Ширина поля кода страны */
	border: 1px solid #ccc; /* Рамка для поля кода страны */
}

.text-input-nomer {
	width: 220px; /* Ширина поля номера */
	margin-left: 10px; /* Отступ слева */
}

.text-input-fio { width: calc(100% - 50px); } /* Устанавливаем ширину с запасом */

.text-input-10 {width: calc(100% - 50px); } /* Рассчитываем ширину */
.text-input-9  {width: calc( 90% - 50px); }
.text-input-8  {width: calc( 80% - 50px); }
.text-input-7  {width: calc( 70% - 50px); }
.text-input-6  {width: calc( 60% - 50px); }
.text-input-5  {width: calc( 50% - 50px); }
.text-input-4  {width: calc( 40% - 50px); }
.text-input-3  {width: calc( 30% - 50px); }
.text-input-2  {width: calc( 20% - 50px); }
.text-input-1  {width: calc( 10% - 50px); }

/* Устанавливаем ширину */
.text-input-500 {width: 500px;} 
.text-input-490 {width: 490px;}
.text-input-480 {width: 480px;}
.text-input-470 {width: 470px;}
.text-input-460 {width: 460px;}
.text-input-450 {width: 450px;}
.text-input-440 {width: 440px;}
.text-input-430 {width: 430px;}
.text-input-420 {width: 420px;}
.text-input-410 {width: 410px;}
.text-input-400 {width: 400px;}
.text-input-390 {width: 390px;}
.text-input-380 {width: 380px;}
.text-input-370 {width: 370px;}
.text-input-360 {width: 360px;}
.text-input-350 {width: 350px;}
.text-input-340 {width: 340px;}
.text-input-330 {width: 330px;}
.text-input-320 {width: 320px;}
.text-input-310 {width: 310px;}
.text-input-300 {width: 300px;} 
.text-input-290 {width: 290px;}
.text-input-280 {width: 280px;}
.text-input-270 {width: 270px;}
.text-input-260 {width: 260px;}
.text-input-250 {width: 250px;}
.text-input-240 {width: 240px;}
.text-input-230 {width: 230px;}
.text-input-220 {width: 220px;}
.text-input-210 {width: 210px;}
.text-input-200 {width: 200px;}
.text-input-190 {width: 190px;}
.text-input-180 {width: 180px;}
.text-input-170 {width: 170px;}
.text-input-160 {width: 160px;}
.text-input-150 {width: 150px;}
.text-input-140 {width: 140px;}
.text-input-130 {width: 130px;}
.text-input-120 {width: 120px;}
.text-input-110 {width: 110px;}
.text-input-100 {width: 100px;}
.text-input-90  {width:  90px;}
.text-input-80  {width:  80px;}
.text-input-70  {width:  70px;}
.text-input-60  {width:  60px;}
.text-input-50  {width:  50px;}
.text-input-40  {width:  40px;}
.text-input-30  {width:  30px;}
.text-input-20  {width:  20px;}



/* Стили для полей с несколькими строками */
	
	
	
	.text-area {
		display: inline-block; /* Отображение в строку */
		padding: 10px; /* Внутренние отступы */
		border: solid 1px #ffffff; /* Рамка вокруг текстовой области */
		border-radius: 15px; /* Закругленные углы */
		background-color: #f0f0f0; /* Цвет фона */
		transition: background-color 0.3s; /* Плавный переход цвета фона */
		width: calc(100% - 50px); /* Устанавливаем ширину с запасом */
	/*     height: 500px; Высота поля */
		height: calc(100vh * 0.5 - 200px); /* Максимальная высота 70% от высоты видимой области */
		resize: none; /* Запрет на изменение размера */
	}
	.text-area:focus {
		background-color: #e0e0e0; /* Цвет фона при фокусе */
		outline: none; /* Убираем обводку */
	}
	
	
	
	/* Стили для поля даты и телефона */
input[type="date"] {
	width: 150px; /* Фиксированная ширина 150 пикселей */
	padding: 10px; /* Внутренние отступы */
	border: 1px solid #ccc; /* Рамка для поля даты */
	border-radius: 15px; /* Закругленные углы */
	background-color: #f0f0f0; /* Цвет фона */
}