// ========================================================================================
// = Базовые настройки ====================================================================


// Базовые цвета сайта
@black: #000;
@white: #fff;
@yellow: #FFB900;
@orange: #F16500;
@blue: #3D72A7;
@lightblue: #9BC1E9;
@darkblue: #31679C;
@gray: #707070;
@lightgray: #E3E8ED;
@link: #34689a;

.yellow { color: @yellow; }

// Плейсхолдеры
.placeholder (@color: #A9A9A9, @font-size: 14px, @line-height: 140%) {
	&::-webkit-input-placeholder { color: @color; font-size: @font-size; line-height: @line-height; font-weight: normal; }
	&:-moz-placeholder { color: @color; font-size: @font-size; font-weight: normal; }
	&::-moz-placeholder { color: @color; font-size: @font-size; font-weight: normal; }	 
	&:-ms-input-placeholder { color: @color; font-size: @font-size; line-height: @line-height; font-weight: normal; }
}

// Закругление углов
.border-radius (@radius: 3px) {
	-webkit-border-radius: @radius !important; 
	-moz-border-radius: @radius !important; 
	border-radius: @radius !important;
}

// Запрет выделения
.noselect() {
  -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none;   /* Chrome/Safari/Opera */
  -khtml-user-select: none;    /* Konqueror */
  -moz-user-select: none;      /* Firefox */
  -ms-user-select: none;       /* IE/Edge */
  user-select: none;           /* non-prefixed version, currently
                                  not supported by any browser */
}

.red { color: red; }

.green { color: green; }


// Базовые шрифты сайта
@opensans: 'Open Sans', sans-serif;

html, body { 
	background: @blue !important; color: #373435; height: 100%;
	font-family: @opensans; font-weight: 400; font-size: 12px;
} body { padding: 0; min-width: 1100px; }

html {
	.android, .ios, .desktop { display: none; }
	
	&.desktop {
		.desktop { display: block !important; }
	}
	&.android {
		.android { display: block !important; }
	}	
	&.ios {
		.ios, { display: block !important; }
	}	
}

.content img { max-width: 100%; }

// Сообщение устаревшим браузерам 
.buorg {
    height: 100%; padding-top: 200px;
}

.clear { width: 100%; overflow: hidden; }
input, button { outline: none; }
.red { color: red; }

pre { max-width: 1000px !important; overflow: hidden !important; }


.technical_message {
	background: #f33200; color: white;
	text-align: center; padding: 3px 2%; 	
}
.announcement {
	background: @orange; color: white;
	text-align: center; 
	div { padding: 3px 0; } 
	&:empty { display:none; }
	.android {
		//img { height: 60px; }
		a { color: #fff; text-decoration: underline; }
	}
}

// ========================================================================================
// = Шапка ================================================================================

header { 
	> section { width: 1000px; height: 125px; margin: 0 auto; position: relative; }
	background: @blue; width: 100%; color: @white; position: relative; z-index: 1001;
	
	a:hover,a:focus { color: @white; }
	
	// Логотип
	.logo {
		color: @white; font-size: 27px; font-weight: 600;
		margin: 13px 0 0 0; position: absolute;
		span { font-weight: 100; }
		&:hover,&:focus { text-decoration: none; color: @white; }
	}
	
	// Логотип 2
	.logo2 {
		display: block; height: 40px;
		background: url(images/logo.png) no-repeat right top; margin: 0; font-weight: normal;
		font-size: 14px; line-height: 110%; text-decoration: none; color: @white;
		position: absolute; margin: 15px 0 0 165px; padding: 4px 40px 0 0; background-size: 30px;
		span:first-child { position: relative; left: 15px; }
		span:last-child { display: block; font-size: 16px; }
		&:hover { text-decoration: none; }
	}	
			
	// Телефон
	.phone { 
		font-size: 20px; position: absolute; margin: 15px 0 0 190px; font-weight: 400;
		&:before { 
			content: ""; display: inline-block; width: 27px; height: 26px; background: url(images/ico_phone.png) no-repeat;
			position: relative; left: -14px; top: 4px; 
   }
	}
	
	// Пользователь
	.login { 
		position: absolute; right: 0; margin: 10px 0 0 0;
		background: #7B9CE9; padding: 35px 10px 5px 10px;
		
		.my_tickets {
			position: absolute; top: 0; left: 0; margin: 10px 0 0 10px; color: @white; 
			font-weight: normal; text-transform: uppercase; font-size: 11px;
			
		}
		
		.user_password_reminder { 
			position: absolute; top: 0; left: 0; margin: 8px 0 0 200px; color: @white; 
			font-size: 12px; font-weight: 200;
			&:before { content: "• "; text-decoration: none !important; }
			//&:after { content: " •"; text-decoration: none !important;}
		}		
		.user_password_reminder:hover {
			&:before { content: "• "; text-decoration: none !important; }
			//&:after { content: " •"; text-decoration: none !important;}
		}
		
		
		.sms_login {
			position: absolute; top: 0; left: 0; margin: 8px 0 0 310px; color: @white; 
			font-size: 12px; font-weight: 200; 
		}

		input { 
			border-radius: 3px; height: 35px; border: none; background: none; background: none; border: none;
			padding-left: 10px; padding-right: 10px; outline: none; color: @black;
		}
		//label { position: relative; }
		input[type=text] { background: @white; width: 175px; .placeholder(); }
		.password_wrapper {
			position: relative;
			input[name=password] { 
				background: @white; width: 120px !important; .placeholder(); 
			}
			.toggle_password {
				position: absolute; right: 10px; top: 0; color: @blue; 
			}
		}
		
		input[type=submit] { background: @orange; color: @white; width: 70px; }
		
		
	}
	.logout { 
		position: absolute; right: 0; margin: 24px 0 0 0; font-size: 13px; 
		.welcome { width: 550px; display: inline-block; position: absolute; right: 0; top: -5px;
			text-align: right;
			span { color: @yellow; }
			a { color: @white; display: inline-block; margin: 0 0 0 25px; }
		}
		
		ul {
			list-style: none; padding: 0; margin: 42px 0 0 0; overflow: hidden; position: absolute; right: 0;
			width: 390px;
			li { float: right; margin: 0 0 0 35px;
				a { color: @white; font-size: 16px; 
					&:before { font-family: "Font Awesome 6 Free"; padding: 0 10px 0 0; }
					&:hover { text-decoration: none; }
				}
				&:nth-child(1) a:before { content: "\f145"; } 
				&:nth-child(2) a:before { content: "\f007"; } 
				
			}
			
		}
	}	
			
	// Навигация
	nav { position: absolute; bottom: 0; 
		ul {
			list-style: none; margin: 0 0 0 0; padding: 0; 
			li { float: left; margin: 0 0 0 0; position: relative;
				a { 
					color: @white; font-size: 16px; padding: 7px 15px 8px 15px; display: inline-block;
					border-bottom: 5px solid @blue; 
				}
				
				a:hover, &.active > a, a:focus, &:hover > a { 
					color: @white; border-color: @orange; text-decoration: none; 
					background: #305B83;
				}
				&:hover ul { display: block; }
				ul {
					display: none; position: absolute; background: @blue; min-width: 200px; z-index: 400;
					padding: 0 0 0 0; margin: 0 0 0 0; background: #305B83;
					li { float: none;
						a { 
							font-size: 14px; padding: 7px 15px; color: @white;  
							display: block; border: none;
						}
						&.active a, a:hover { color: @white; background: @blue; border: none; }
					}
				}
			}
		}
	}

} // .Шапка


// ========================================================================================
// = Контент и Сайдбар ====================================================================

.wrapper { display: flex; flex-direction: column; /* Ставит детей строго друг под другом */
width: 100%; background: #FBFCFE; overflow: hidden;
	margin: 0 auto 0 auto;	
	&.wide { background: #F0F5F8; 
		section.columns { padding: 0 0 30px 0;  }
	}
}

//section.columns { 
 //   display: flex; 
 //   justify-content: space-between; 
 //   width: 1000px; 
//    margin: 0 auto; 
   // padding: 17px 0;  
	
	// Широкая страница (внутри .wrapper.wide)
	//.wide_content { 
        // margin: 27px 0 0 0; - удаляем маргин, используем gap или расчет ширин
     ///   width: calc(68% - 15px); /* Занимаем ~68%, оставляя место под gap/margin */
        
     //   > section { background: @white; text-align: center; padding: 25px 0; .border-radius (@radius: 3px); }
			
     //   h1 { font-size: 22px; color: @black; margin: 0; padding: 0; font-weight: normal;
     //       strong { color: @darkblue; }
     //       span { color: #929292; display: block; font-size: 14px; padding: 5px 0 0 0; }
     //   }		
	//}
	
	/* === ГЛАВНОЕ ИСПРАВЛЕНИЕ === */
	// Удаляем старый мусор от таблиц:
	// .content, aside { display: table-cell; ... } КОММЕНТИРУЕМ ИЛИ УДАЛЯЕМ ПОЛНОСТЬЮ

	// Контент (.content теперь тоже часть флекса)
	//.content { 
  //      line-height: 150%; 
   //     width: calc(68% - 15px); /* Явно задаем ту же ширину, что и wide_content */
        
        /* ... ваши стили хлебных крошек, списков, заголовков остаются здесь БЕЗ изменений ... */
        
    //    a { color: @link; &:hover { color: @link; } }
	//}
	
	// Сайдбар
	//aside { 
    //    width: 300px; 
     //   min-width: 300px; 
        
        // Возвращаем верхний отступ для визуального выравнивания с началом текста слева
     //   padding-top: 37px; 
        
        // Если вы хотите убрать вертикальный зазор между контентом и сайдбаром,
        // можно использовать align-self: flex-start, если у .content большой margin-top
        
      //  .block { 
      //      margin-bottom: 20px; border: 1px solid @lightgray; border-radius: 3px; 
      //      padding: 15px; width: 300px; /* Фикс ширина дублирует aside */
      //      background: @white;
            
       //     h3 { font-size: 16px; font-weight: bold; margin: 0 0 10px 0; padding: 0; }
      //      a { color: @link; &:hover { color: @link; } }
       //     img { margin: 5px 0 5px -15px; }
      //  }
		
		//.news {
		//	ul { list-style: none; margin: 0; padding: 0 0 10px 0;
		//		li {  
		//			border-bottom: 1px solid @lightgray; padding: 10px 0;
		//			a { display: inline-block; }
		//			span.title { display: block; font-weight: bold; font-size: 15px; margin: 0 0 3px 0; }
		//			span.text b { font-weight: normal !important; }
		//			.date {
		//				display: block; text-decoration: none; color: #CACDD2; font-size: 12px; font-weight: 600;
		//				padding: 0 0 3px 0; 
		//			}
		//		}
		//	}
	//	}
	//}
//}

section.columns { 
    display: flex; 
    justify-content: space-between; 
    width: 1000px; 
    margin: 0 auto; 
    padding: 17px 0;  
	
	/* === КРИТИЧЕСКИ ВАЖНО === */
	.content { 
        line-height: 150%;
        width: 680px; /* Фиксированная ширина контента ~68% */
        
        /* Удалите отсюда класс .wide_content со своими стилями h1, если он дублирует контент */
        
        a { color: @link; &:hover { color: @link; } }
	}
	
	aside { 
        width: 300px; 
        min-width: 300px; 
        padding-top: 37px; 
        flex-shrink: 0; /* Запрещаем сжиматься */
        
        .block { 
            margin-bottom: 20px; 
            border: 1px solid @lightgray; 
            border-radius: 3px; 
            padding: 15px; 
            background: @white;
            
            h3 { font-size: 16px; font-weight: bold; margin: 0 0 10px 0; }
            img { margin: 5px 0 5px -15px; }
        }
		
		.news ul li { 
            border-bottom: 1px solid @lightgray; 
            padding: 10px 0; 
            a { display: inline-block; }
            span.title { display: block; font-weight: bold; font-size: 15px; margin: 0 0 3px 0; }
            .date { color: #CACDD2; font-size: 12px; font-weight: 600; }
		}
	}
}
  
// ========================================================================================
// = Подвал ===============================================================================

.social {
	padding: 0 0 15px 0; margin: 0 0 0 0;
	text-align: left;
	a:not(.liveinternet) img {
		padding: 0 !important; margin: 0; background: none !important; border: 0 !important;
		width: auto; max-width: 30px;
	}
	img { margin-right: 10px !important; display: inline-block; }
}

.push { display: none; }
footer { 
	> section { width: 1000px; margin: 0 auto; position: relative;  padding: 0 0 0 0; display: flex; flex-direction: row;  }
	background: #4073A5; width: 100%; position: relative;
	color: @white; min-height: 320px;
	
	a { color: @lightblue; }
	
	// Левая колонка
	.left { 
		width: 250px; border-right: 1px solid #4E7EAC; padding: 25px 45px 0 0;
		margin: 0 0 0 0; 
		
		// Логотип
		.logo {
			color: @white; font-size: 27px; font-weight: 600;
			span { font-weight: 100; }
			&:hover { text-decoration: none; color: @white; }
		}			
		
		// Социальные кнопки
		.social { 
			border: 1px dashed #305D8D; display: block; height: 23px; width: 100%; margin: 10px 0 20px 0; 
			display: none;
		}
		
		// Текст
		p { font-size: 12px; line-height: 180%; }
	}
	
	// Навигация
	nav { 
    	padding: 30px 20px; margin: 0px;  border-right: 1px solid #4E7EAC; 
		> ul { list-style: none; margin: 0; padding: 0; display: table;
			> li { 
				display: table-cell; min-width: 170px; padding: 0 45px 0 0; position: relative; font-family: @opensans;
				a, > a:hover { color: @white; font-size: 14px; display: inline-block; font-weight: 400; }
				&.last { min-width: auto; padding-right: 0; }
				
				// Второй уровень
			  > ul { list-style: none; margin: 10px 0 0 0; padding: 0;
					> li { font-size: 10px; margin: 0 0 12px 0;
						a { color: @lightblue; text-decoration: none; font-size: 12px; font-weight: 400; }
						&.active a, a:hover { color: @white; text-decoration: underline; }
					}
				}
			}
		}
	}
	
	
	.contacts { 
		right: 0; font-size: 20px; width: 300px; font-weight: 400; top: 0; margin: 0 0 0 20px; padding: 30px 0 0 0;
		a { font-size: 15px; font-weight: normal; position: relative; top: -2px; }
	}
	
	.counters {
		position: absolute; right: 0; top: 0; margin: 198px 0 0 0;
		img { margin-left: 5px; }
	}
	
	.uniteller { 
		text-align: left; font-size: 12px; margin: 20px 0 0 0;
		a:hover { color: @white; }
		i { display: block; } 
		img { position: relative; left: -20px; }
	}
	
} // .footer


// ========================================================================================
// = Страница новостей ====================================================================

ul.news { 
	list-style: none; padding: 0; margin: 0;
	li {  
		margin: 0 0 30px 0;
		.date { display: block; color: @gray; }
		span.title { display: block; font-weight: bold; font-size: 16px; }
		a { display: inherit; }
	}
}

.pagination .active a { color: @white !important; }




// ========================================================================================
// = Другие элементы ======================================================================

iframe { max-width: 100%; }

// Страница контактной формы
input.error, textarea.error { background: #ffe9e9 !important; }

// Валидация Parsley
.parsley-error { border-color: red !important; b { border-color: red !important; } }
.parsley-errors-list, .parsley-error-list { display: none !important; }
.parsley-success { border-color: green !important; b { border-color: green !important; } }


// ========================================================================================
// = Шаг 1: Поиск =========================================================================

.search-top-message {
	padding: 10px 0 20px 0;
	text-align: center;
	color: #3d72a7;
}

.search { 
	
	min-width: 1100px;
	
	> section { width: 1000px; margin: 0 auto; height: 100%;
	position: relative;
	}
	background: url(images/search_bg.webp) no-repeat #244D73 center; background-size: cover; /* Главное правило */ 
	height: 250px; margin: 0 0 0 0;  width: 100%; left: 0; z-index: 1000; //убрал position: absolute;
	
	//&.results {
	//	margin-top: 0px; //было -220
	//}
	
	// Форма поиска
	form { 
		margin: 45px 0 0 0;
		
		table { width: 100%; 
			td { padding-right: 5px; vertical-align: top; }
			td:nth-child(5) { padding-left: 5px; padding-right: 0; }
		}
		
		// Заголовки
		tr.headers {
			color: @white; font-size: 12px;
			td:nth-child(1) { padding-left: 17px; }
			td:nth-child(2) { padding-left: 17px; }
			td:nth-child(3) { padding-left: 15px; }
		}
		
		// Поля ввода
		/* Поля ввода */

/* Поля ввода */
tr.inputs {
    height: 60px;

    /* Главные элементы выбора */
    .choices {
        width: 100%; /* Занимает всю ширину родителя */
    height: 48px; /* Высоту задаём явно */
    line-height: 48px; /* Горизонтальное выравнивание текста */
    font-size: 18px;
    font-weight: bold;
    background: white;
    border: 1px solid #E3E8EA;
    border-radius: 3px;
    box-sizing: border-box;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
	z-index:1000;
    }

   /* Поле выбора документа (Choices.js) — делаем его визуально полноценным */
.choices[data-type="select-one"] {
  min-height: 48px !important;
  height: 48px !important;
  width: 100% !important;
}

.choices__inner {
  display: block !important;        // вместо flex — убирает схлопывание пустого списка
  height: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  background-color: white !important;
  box-sizing: border-box !important;
  position: relative;              // нужен для позиционирования стрелки
}

/* Сам список (то, что схлопывается в полоску) */
.choices__list--single {
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Стрелка — делаем её частью списка, чтобы стояла ровно справа по центру */
.choices__list--single::after {
  content: '' !important;
  display: inline-block !important;
  width: 15px !important;
  height: 8px !important;
  background: url('images/select_arrows.png') no-repeat bottom !important;
  position: absolute !important;
  right: 15px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  pointer-events: none !important;
  z-index: 2;
}

/* Элементы списка — чтобы они не схлопывались и были удобными для клика */
.choices__item {
  padding: 12px 15px !important;
  line-height: normal !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: 290px !important;
  word-break: break-all !important;
  cursor: pointer !important;
  background-color: transparent !important;
}

/* Если у тебя есть состояние «пусто» — можно добавить лёгкий плейсхолдер-эффект */
.choices--no-results,
.choices--empty {
  color: #999 !important;
}


    /* Убираем лишние стрелки */
    .choices__inner::after,
    .choices::after {
        display: none; /* скрыть все прочие стрелки */
    }

    /* Открытое состояние стрелки */
    .choices__list--single.is-open::after {
        transform: translateY(-50%) rotate(180deg);
    }

    /* Элементы выбора */
    .dispatch_station,
    .arrival_station {
        width: 100%;
        min-width: 307px;
    }

    /* Выбор даты */
    input[name=departure_date] {
        height: 48px;
        width: 140px;
        outline: none;
        font-weight: bold;
        font-size: 16px;
        padding-left: 15px;
        background: white url('images/ico_calendar.png') no-repeat 90% 14px;
    }

    /* Количество билетов */
    /* Количество билетов */
td.number_of_seats {
    position: relative;
    input[name=number_of_seats] {
        height: 48px;
        width: 106px;
        padding-left: 40px;
        outline: none;
        font-weight: bold;
        font-size: 18px;
        text-align: center; /* Центрируем текст в поле */
    }
    section {
        position: absolute;
        top: 0;
        right: 0;
        margin: 0;
        border-radius: 0 3px 3px 0;
        background: url('images/input_arrows_gradient.png');
        width: 27px;
        height: 48px;
        text-align: center;
        .inc,
        .dec {
            width: 13px;
            height: 7px;
            background: url('images/input_arrows.png') no-repeat;
            display: inline-block;
            cursor: pointer;
        }
        .inc {
            background-position: left top;
        }
        .dec {
            background-position: left bottom;
            margin: 12px 0 0 0;
            &.inactive {
                background-position: right bottom;
            }
        }
    }
    &:before {
        font-family: "Font Awesome 6 Free";
        content: "\f21d";
        display: block;
        color: yellow;
        font-size: 20px;
        position: absolute;
        top: 0;
        margin: 12px 0 0 14px;
    }
}
    /* Кнопка "Найти" */
    button[type=submit] {
        background: none;
        border: none;
        border: 2px solid white;
        color: white;
        height: 48px;
        width: 115px;
        border-radius: 3px;
        font-size: 18px;
        font-weight: 400;
        i {
            padding: 0 10px 0 0;
        }
    }
}
	} // .поля ввода
	
	// Действия
	tr.actions {
		color: @lightblue; font-size: 12px; font-weight: 400;  
		
		div { position: absolute; margin-top: -7px; }
		
		span { 
			color: @white; border-bottom: 1px dashed @white; display: inline-block; padding: 0 0 2px 0; cursor: pointer;
		}
		td:nth-child(1),td:nth-child(2),td:nth-child(3) {  
			padding: 0 5px 0 0;
			div { 
				background: rgba(58, 103, 153, 0.4); padding: 3px 0 0 0;
				position: relative; top: -3px; border-radius: 3px;
			}
		}
		
		td:nth-child(1) div { padding-left: 17px; }
		td:nth-child(2) div { padding-left: 17px }
		td:nth-child(3) div { text-align: center;
			span { 
				margin: 0 3px 0 0; font-size: 9px; 
				cursor: pointer;
			}
		}
	}	
	
	// Найдено билетов
	.quantity {
		color: @white; position: absolute; bottom: 0; margin: 0 0 53px 0; font-size: 17px;
	}
	
	// Сортировка билетов в блоке поиска
	.search_sorting {
		position: absolute; bottom: 0; right: 0; margin: 0 0 45px 0;
		
		.title { color: @lightblue; font-size: 12px; display: inline-block; padding: 0 10px 0 0; }
		
		.sort { 
		  padding: 0 27px 0 18px; border: none; display: inline-block; color: @white; height: 35px; line-height: 35px;
		  background: #639ACA; text-align: left; cursor: pointer; margin: 0 -2px 0 0; position: relative; 
		  font-size: 12px; font-weight: 400;
		  
		  &:after { 
			  content: ""; width: 8px; height: 13px; background: url(images/sort_arrows.png) no-repeat left; 
			  position: absolute; right: 0; margin: 11px 11px 0 0
			}
		  
		  &.first { border-radius: 3px 0 0 0; margin-right: -3px; }
		  &.last { margin-right: 0; border-radius: 0 3px 0 0; }
		  &:hover { text-decoration: none; }
			&:focus { outline: none; }
			
			&.asc { background: @white; color: @black; &:after { background-position: center top; } }
			&.desc { background: @white; color: @black; &:after { background-position: right top; } }
		}
	}		
	
} //.блок поиска


// Шаги
ul.steps {
	margin: 0 0 20px 0; list-style: none; padding: 0; overflow: hidden; display: table; table-layout: fixed;
	width: 100%; text-align: center;
	&.normal { margin: 20px 0; }
	li { 
		display: table-cell; font-size: 18px; color: @gray; padding: 5px 0; 
		&:before {
			width: 35px; height: 35px; text-align: center; line-height: 34px; color: @gray;
			border-radius: 50%; border: 1px solid @lightgray; display: inline-block; position: relative;
			margin: 0 14px 0 0;
		}
		&:nth-child(1):before { content: "1"; }
		&:nth-child(2):before { content: "2"; }
		&:nth-child(3):before { content: "3"; }
		&:nth-child(4):before { content: "4"; }
		&:nth-child(5):before { content: "5"; }
		
		&.active { background: @yellow; color: @black; font-weight: 500; border-radius: 0 30px 30px 0;
			&:before { 
				border: none; display: inline; color: @black; margin: 0; 
			}
			&:nth-child(1) { border-radius: 5px 30px 30px 5px; &:before { content: "1. "; } }
			&:nth-child(2):before { content: "2. "; }
			&:nth-child(3):before { content: "3. "; }
			&:nth-child(4):before { content: "4. "; }
			&:nth-child(5) { border-radius: 0 5px 5px 0; &:before { content: "5. "; } }
		}
		
		&.last { border-radius: 0 !important; color: #D09500;
			&:after { 
				font-family: "Font Awesome 6 Free"; content: "\f0da"; margin: 7px 10px 0 25px; position: absolute; color: #B28212; 
			}			
			&:before { color: #D09500; }
		}		
		
	}
}	

// Ссылки между шагами
.nav_links {
	text-align: center; padding: 30px 0 0 0;
	a { 
		display: inline-block; border: 2px solid #F0F5F8; .border-radius (@radius: 3px);
		padding: 10px 15px; font-size: 18px;
		&.prev { margin-right: 30px; }
		&.next {
			text-decoration: none; border: 2px solid @darkblue; color: @black;
		}
		&:hover { text-decoration: none; }
	}
}

// Нет результатов
.no_results {
	background: @white; padding: 20px; .border-radius (@radius: 3px);	
}

// Сортировка билетов над списком билетов
.sorting { 
	width: 100%; background: @white; padding: 10px 0 0 0; margin: 0 0 0 0;
	> section { height: 30px; }
	
	.sort { 
	  text-align: left; cursor: pointer; margin: 0 100px 0 0; position: relative; 
	  font-size: 12px; font-weight: 500; background: none; border: none; padding: 0 20px 0 0;
	  
	  &:nth-child(1) { margin: 0 0 0 20px; }
	  &:nth-child(2) { margin: 0 0 0 350px; }
	  &:nth-child(3) { margin: 0 0 0 200px;  }
	  
	  &:after { 
		  content: ""; width: 17px; height: 15px; background: url(images/sort_arrows2.png) no-repeat left; 
		  position: absolute; right: 0; color: @gray;
		}
	  
	  &.first { border-radius: 3px 0 0 0; }
	  &.last { margin-right: 0; border-radius: 0 3px 0 0; }
	  &:hover { text-decoration: none; }
		&:focus { outline: none; }
		
		&.asc { background: @white; color: @link; &:after { background-position: center top; } }
		&.desc { background: @white; color: @link; &:after { background-position: right top; } }
	}
}	

 
// Лента билетов
ul.tickets {
	list-style: none; margin: 2px 0 0 0; padding: 0; width: 100%; background: @white; color: @gray;
	> li {
		display: block; border-bottom: 1px solid @lightgray; background: @white;
		margin: 0; padding: 25px 0; font-size: 12px; width: 100%;
		
		.no_places { 
  		display: none; 
  		font-size: 18px; margin: 6px 0 0 0; 
  		color: #000; 
      padding: 7px 20px 7px 15px; 
      text-align: center; 
      font-weight: 500; float: right;
			line-height: 30px; 
			position: relative; top: -9px;
			border: 1px solid #999; 
			border-radius: 3px; 
			width: 130px;		
    }
		
		.route-message {
		  background: #f16500; padding: 20px;
      color: #fff; text-align: center;
      margin-top: 10px; font-size: 14px;
		}

		&.disabled {
			background: #cfcfcf !important; cursor: default !important; opacity: 0.3;
			.buy, .large.price { display: none !important; }
			.no_places { display: inline-block; }
		}
		
				
		table { width: 1000px; margin: 0; padding: 0;
			
			td { border: none !important; vertical-align: top; }
			
			td:nth-child(1) { padding: 0 0 0 25px; }
			
			// Первый и Третий столбцы
			td:nth-child(1), td:nth-child(3) { width: 290px; }
			
			// Второй столбец
			td:nth-child(2) { width: 190px; padding: 0 30px; position: relative;
				.arrow { 
					background: url(images/ticket_arrow.png) no-repeat; width: 13px; height: 25px; display: inline-block; 
					position: absolute; right: 0; margin: 20px 25px 0 0; top: 0;
				}
			}	
			
			td:nth-child(4) { width: 250px; text-align: right; padding: 0 25px 0 0; }			
		}

		// Центральная линия		
		.large { font-size: 17px; display: block; padding: 8px 0; line-height: 100%; }
		
		b { color: @black; }
				
		// Цена
		.price { display: inline-block; padding: 4px 13px 4px 0; }
		
		// Кнопка «Купить»
		&:hover { background: #E5EAEE; cursor: pointer;
			span.buy { background: @yellow; color: @white; text-decoration: none; &:before { color: @white; } }
		}
		span.buy { 
			color: #fff; padding: 7px 20px 7px 15px; text-align: center; font-weight: 500; float: right;
			line-height: 30px; display: inline-block; font-size: 18px; position: relative; top: -9px;
			border: 1px solid @yellow; border-radius: 3px; background: @white; color: @black;
			&:before { font-family:"Font Awesome 6 Free"; content: "\f07a"; padding: 0 10px 0 0; color: @yellow; font-size: 20px; }
		}
		
		// Текст «Взрослый / детский»
		.type { padding: 5px 0 4px 0; display: inline-block; }
		
		// Информационная строка
		ul.info { list-style: none; margin: 5px 0 0 0; padding: 0 0 0 25px; overflow: hidden;
			li { 
				float: left; margin: 0 25px 0 0; position: relative;
				span { color: @orange; }
				&:after { 
					content: ""; width: 5px; height: 5px; background: #C8C8C8; position: absolute; 
					right: 0; margin: 6px -15px 0 0; 
				}
				&:last-child:after { display: none; }
			}
		}
				
	}
}


// ========================================================================================
// = Шаг 2: Выбор места ===================================================================

.seats {  
	> section { background: @white; text-align: center; padding: 25px 0; .border-radius (@radius: 0 0 3px 3px); }
	
	// Заголовок
	h1 { display: block; font-size: 22px; color: @black; margin: 0; padding: 0; font-weight: normal;
		strong { color: @darkblue; margin-right: 20px; &:nth-child(2) { margin: 0; } }
		span { color: #929292; display: block; font-size: 14px; padding: 5px 0 0 0; }
	}
	
	.bus_preloader {
		text-align: center;
	}
	
	// Схема автобуса
	.scheme { 
		height: 260px; position: relative; display: inline-block;
		margin: 20px auto 40px auto; padding: 25px 20px 0 90px; 
		
		background: url(images/bus_bg.png) no-repeat left;
		
		.error { text-align: center; }
		.bus_preloader { padding-top: 20px; }
		
		&:after { 
			background: url(images/bus_bg.png) no-repeat right; width: 20px; height: 260px; 
			content: ""; position: absolute; z-index: 20; display: inline-block; top: 0; right: 0; margin-right: -20px;
		}
		
		section.outer { display: inline-block; text-align: left; }		
		section { 
			overflow: hidden;
			
			div { margin: 0 20px 0 0; display: inline-block; 
				label { display: block; cursor: pointer; }
				span {
					display: block; text-align: center; margin: 0 0 10px 0; color: #c3a09a; font-weight: bold; padding: 0 5px 0 0;
					background: url(images/seats.png) no-repeat right; width: 35px; height: 34px; line-height: 34px; 
					&.active { color: #31702d; background-position: center; cursor: pointer; }
					&.empty { background: none !important; }
				}
				input:checked + span { background-position: left; color: #876721 !important; }
				input { display: none; }				
			}		

		}
	}
	
	@media only screen and (min-width: 701px) { 
		
		.scheme.large { 
			height: 260px; position: relative; display: inline-block;
			margin: 20px auto 40px auto; padding: 45px 0px 0 60px; 
			
			background: url(images/bus_bg.png) no-repeat left;
			background-size: cover;
			&:after { 
				background: url(images/bus_bg.png) no-repeat right; width: 20px; height: 260px; 
				background-size: cover;
				content: ""; position: absolute; z-index: 20; display: inline-block; top: 0; right: 0; margin-right: -20px;
			}
			
			section.outer { display: inline-block; text-align: left; }		
			section { 
				overflow: hidden;
				
				div { margin: 0 20px 0 0; display: inline-block; 
					label { display: block; cursor: pointer; }
					span {
						display: block; text-align: center; margin: 0 0 10px 0; color: #c3a09a; font-weight: bold; padding: 0 5px 0 0;
						background: url(images/seats.png) no-repeat right; width: 24px; height: 24px; line-height: 24px; 
						background-size: cover; font-size: 10px;
						&.active { color: #31702d; background-position: center; cursor: pointer; }
						&.empty { background: none !important; }
					}
					input:checked + span { background-position: left; color: #876721 !important; }
					input { display: none; }				
				}		
	
			}
		}	
	
	}
	
	// Сообщение пользователю
	.status_message { position: relative; top: -20px; 
		span.clear { color: @link; border-bottom: 1px dashed @link; cursor: pointer; }
	}
	
	// Подсказка на синем фоне
	.hint { 
		background: @darkblue; padding: 20px 0; text-align: center; margin: 0 0 -25px 0;
		color: @white; .border-radius (@radius: 0 0 3px 3px); 
	}
}



// ========================================================================================
// = Шаг 3: Ввод данных ===================================================================

.form-filling {
	
	> section { background: @white; padding: 25px 0; .border-radius (@radius: 3px); }
	
	// Очистка формы
	.form_clear {
		float: right; cursor: pointer; display: inline-block; padding: 5px 10px;
		position: relative; top: -5px;
		&:hover { background: #3b79b8; }
	}
	
	// Данные рейса
	.route_info { color: @gray; padding: 0 0 20px 0; border-bottom: 1px solid @lightgray; margin: 0 0 20px 0;
		
		table { width: 1000px; margin: 0; padding: 0;
			
			td { border: none !important; vertical-align: top; }
			
			td:nth-child(1) { padding: 0 0 0 25px; }
						
			// Первый и Третий столбцы
			td:nth-child(1), td:nth-child(3) { width: 290px; }
			
			// Второй столбец
			td:nth-child(2) { width: 1%; padding: 0 5px; position: relative;
				//.large { white-space: nowrap; }
				.arrow { 
					background: url(images/ticket_arrow.png) no-repeat; width: 13px; height: 25px; display: inline-block; 
					position: absolute; right: 0; margin: 20px 25px 0 0; top: 0; display: none;
				}
			}	
			td:nth-child(3) { text-align: right; padding: 0 25px 0 0; }
			td:nth-child(4) { width: 250px; text-align: right; padding: 0 25px 0 0; }		
			
			table { table-layout: auto !important; width: 100% !important;
				td { 
					padding: 0 !important; margin: 0 !important; 
					
					&.text { width: 1% !important; white-space: nowrap; .large { white-space: nowrap !important; } }
					&.line {
						padding: 0 10px !important; width: 99%; overflow: hidden;
						div { 
							width: 100% !important; height: 2px; background: @orange; display: block; 
							margin: 15px 0 0 0; position: relative;
							&.left:before { 
								width: 10px; height: 10px; content: ""; background: @orange; border-radius: 50%; 
								display: block; position: absolute; left: 0; top: 0; margin: -4px 0 0 0;
							}
							&.right:before { 
								width: 10px; height: 10px; content: ""; background: @orange; border-radius: 50%; 
								display: block;  position: absolute; right: 0; top: 0; margin: -4px 0 0 0;
							}							
						}
					}
				}
			}				
		}

		// Центральная линия		
		.large { font-size: 17px; display: inline-block; padding: 4px 0; white-space: nowrap; }
		
		b { color: @black; }
				
		// Цена
		.price { display: inline-block; padding: 4px 13px 4px 0; }
		
		// Текст «Взрослый / детский»
		.type { padding: 5px 0 4px 0; display: inline-block; }
		
		// Информационная строка
		ul.info { list-style: none; margin: 20px 0 0 0; padding: 0 0 0 25px; overflow: hidden;
			li { 
				float: left; margin: 0 25px 0 0; position: relative;
				span { color: @link; }
				&:after { 
					content: ""; width: 5px; height: 5px; background: #C8C8C8; position: absolute; 
					right: 0; margin: 6px -15px 0 0; 
				}
				&:last-child:after { display: none; }
			}
		}
		
	} //.данные рейса
	
	// Статус пользователя
	.user_info {
		background: @darkblue; padding: 15px; color: @lightblue; font-size: 18px;
		width: 965px; margin: 0 auto; .border-radius (@radius: 3px 3px 0 0);
		span { color: @white; }
	}
	
		
	// Список пассажиров
	ul.forms {
		display: block; list-style: none; margin: 0 auto; padding: 0; .border-radius (@radius: 0 0 3px 3px);
		background: #F7FBFC; border: 1px solid #F1F3F5; border-top: none; width: 963px;
		> li {
			padding: 20px; color: @gray; border-bottom: 3px solid @lightgray;
			// Номер места
			h3 { margin: 0; padding: 5px 0 20px 0; font-size: 17px; display: block; overflow: hidden; font-weight: bold; }
			// Разбивка на колонки
			ul { margin: 0; padding: 0; list-style: none;  display: inline-block; width: 100%;
				li { float: left; width: 50%; } 
				li:nth-child(2) { padding-left: 20px; }
			}
			
		}
	}
	
	div.label.passport { text-align: left; padding: 0 !important; margin: 0 0 5px 0; }
	
	.check-email { 
		text-align: right; padding-right: 8px; 
		&.clear {
			text-align: left; padding: 0;
		}
	}
	
	.email-spam-message {
    	display: none;
    	font-size: 14px;
    	padding: 0 0 0 445px;
    	i {
        	font-style: normal;
        	background: @orange;
        	display: inline-block;
        	padding: 2px 8px;
        	color: #fff;
        	font-size: 12px;
        	font-weight: bold;
    	}
	}
				
				
	.password_wrapper {
		position: relative;
		input { 
			 
		}
		.toggle_password {
			position: relative; right: 35px; top: -3px; color: @blue; 
		}
		.generate-password {
			position: relative; top: -3px;
		}		
	}
						
	// Одно поле
	label, div.label { display: block; font-weight: 400; color: @gray; font-size: 14px;
		&.select { position: relative; margin: 0 0 0 0; }
		// Заголовок поля
		span { width: 190px; display: inline-block;  
			&.select { position: relative; top: -14px; }
		}
		
		// Блок радио-кнопок
		label { display: inline-block; cursor: pointer;
			
			input[type=radio] { display: none; }
			b { 
				font-weight: normal; display: inline-block; height: 38px; width: 118px;
				border: 1px solid #E3E8EA; .border-radius (@radius: 3px); padding: 0 15px 0 35px; line-height: 38px;
				background: @white; position: relative;
				&:before { 
					background: url(images/check.png) no-repeat right; width: 19px; height: 13px; content: ""; 
					position: absolute; top: 0; left: 0; margin: 10px 0 0 10px;
				}
			}
			input[type=radio]:checked + b:before { background-position: left !important; }
			input[type=radio].parsley-success:checked + b { border-color: green; }
			input[type=radio].parsley-error + b { border-color: red; }
		}
		section { display: inline-block; width: 240px; height: 38px; }
		
		// Текстовое поле
		input[type=text],input[type=email],input[type=password] { 
			width: 240px; height: 38px; border: 1px solid #E3E8EA; .border-radius (@radius: 3px);
			padding: 0 15px; font-size: 16px; font-weight: 500; outline: none;
			&:focus { border-color: @yellow; }
		}
		
		// Серия и номер
		input[name=series] { width: 100px; }
		input[name=number] { width: 136px; z-index: 200; }
		
		input:disabled, input:disabled:checked+b { border-color: green; opacity: 0.5 }
		input:disabled+b { opacity: 0.5 }
		
		
		// Выбор даты
		input.date { 
			width: 140px; outline: none; 
			font-weight: bold; font-size: 16px; padding: 0 35px 0 15px;
			background: @white url(images/ico_calendar.png) no-repeat 90% 8px;
			.placeholder (#808080, 14px, 24px); font-weight: 500;
		}
		
    	// Национальность и документы
    	 /* Основные стили для пунктов выбора */
/* Главный элемент выбора */
.choices {
    width: 240px; /* фиксируем ширину */
    height: 46px;
    line-height: 46px; /* выровняем текст по центру */
    font-size: 16px;
    font-weight: bold;
    background: white; /* чисто-белый фон */
    border: 1px solid #E3E8EA;
    border-radius: 3px;
    box-sizing: border-box;
    position: relative;
    display: flex; /* добавляем Flexbox для центровки */
    align-items: center; /* центрируем по вертикали */
    justify-content: center; /* центрируем по горизонтали */
			

	
}

/* Внутренний слой (устанавливаем белый фон) */
.choices__inner {
    background-color: white; /* чисто-белый фон */
    height: 100%; /* занимаем всю высоту родителя */
    padding: 0; /* убираем лишние отступы */
    display: flex; /* используем Flexbox */
    align-items: center; /* центрируем текст по вертикали */
    justify-content: center; /* центрируем текст по горизонтали */
			

}

/* Стили для выбора */
.choices__item {
    padding: 0 15px;
    line-height: inherit;
    background-color: transparent;
    white-space: nowrap; /* запрет переноса текста */
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 220px; /* увеличим максимальную ширину */
    word-break: break-all; /* разрешить перенос символов */
	
}

/* Стили для активного пункта */
.choices__item.is-selected {
    background-color: #eeeeee; /* светло-серый цвет */
			

}

/* Стили для пунктов */
.choices__item {
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
			

}

/* Удобное отображение пунктов */
.choices__item {
    padding: 0 15px; /* небольшие отступы */
			

}

/* Выпадающий список пунктов выбора */
.choices__list--single {
    position: absolute; /* устанавливаем абсолютное позиционирование */
    z-index: 1000; /* поднимаем выше других элементов */
    min-width: 200px;
    background-color: white;
    border: 1px solid #E3E8EA;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* небольшая тень для отделения от фона */
    padding-right: 30px;
			

}

/* Общий контейнер выбора */
.choices {
    position: relative; /* устанавливаем относительное позиционирование для parent container */
    z-index: 1; /* ставим минимальный индекс для контейнера */
	
}





/* Минимальная ширина справочника */
.choices__list--single {
    min-width: 200px;
			

}

/* Стрелка выбора */
.choices__list--single::after {
    content: '';
    display: inline-block;
    width: 15px;
    height: 8px;
    background: url('images/select_arrows.png') no-repeat center / cover;
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%); /* центрируем стрелку */
			

}

/* Открытое состояние стрелки */
.choices__list--single.is-open::after {
    transform: translateY(-50%) rotate(180deg);
			

}

/* Элементы формы */
.nationality, .identify_card {
    width: 240px;
    height: 46px;
    display: inline-block;
    vertical-align: middle;
}

/* Обработаем активное состояние */
.choices__item--selected {
    color: black;
    background-color: white; /* чисто-белый фон */
}

/* Наведение */
.choices__item:hover {
    background-color: rgba(239, 239, 239, 0.3); /* легкий серый фон при наведении */
}

/* Минификация списка */
.choices__list--single {
    padding-right: 30px;
}

/* Оформление пунктов */
.choices__item {
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
			

}

/* Удобное отображение пунктов */
.choices__item {
    padding: 0 15px; /* небольшие отступы */
}

/* Мобильная версия */
@media screen and (max-width: 768px) {
    .nationality, .identify_card {
        width: 100%;
    }
}

/* Завершение файла стилей */
/* Остальные стили */
    	//.selectize-input input { font-size: 16px !important; }				
		
	}
	
	
	form.contacts, form.password {
    	
        display: block; list-style: none; margin: 0 auto; padding: 0; .border-radius (@radius: 0 0 3px 3px);
		background: #F7FBFC; border: 1px solid #F1F3F5; border-top: none; width: 963px;

		padding: 20px; color: @gray; border-bottom: 3px solid @lightgray;    	
    	
		// Телефон
		input[name=phone].enabled { padding-left: 101px; }
		    	
    	input[name=phone] {
    		padding-left: 50px !important; 
    	}
    	
    	input[name=phone]:disabled {
    		padding-left: 10px !important; 
    	}
    	
    	.selected-flag { outline: none !important; }
    	.country-list {
    		overflow: auto !important; width: 296px !important;
    		li { float: none !important; width: auto !important; 
    			//&:nth-child(2) .flag-box { margin-left: -10px; }
    		}
    		.country-name { max-width: 180px; overflow: hidden; }
    	}		
    	
    	
    	input.email-pincode, input.phone-pincode { width: 100px; float: left; }
    	
    	.check-phone-pincode, .check-email-pincode {
        	display: inline-block;
    	}    	
    	
    	.pincode-email-preloader, 
    	.pincode-phone-preloader, 
    	.check-email-pincode, 
    	.check-phone-pincode,
    	input[name=email_pincode],
    	input[name=phone_pincode] { display: none; }
    	

    	
    	.email-actions, .phone-actions {
        	position: relative; top: -3px;
        	padding-left: 5px;
        	
        	.info {
            	position: relative; 
        	}
        	.timer{
            	padding: 0 0 0 10px;
        	}
    	}
	}	
		
}

// ========================================================================================
// = Шаг 3.2: Проверка ====================================================================

.form-check { 
	
	> section { background: @white; padding: 25px 25px; .border-radius (@radius: 3px); }
	
	.form-filling .route_info;
	
	.route_info { 
		max-width: 1000px !important; background: #F0F5F8; border: 1px solid @lightgray; padding: 20px 0; 
		margin: 15px 0;
		table { width: 100% !important; }
	}
	
	// Заголовок
	h1 { 
		display: block; font-size: 22px; color: @black; margin: 0 0 30px 0; 
		padding: 0; font-weight: normal; text-align: center;
		strong { color: @darkblue; }
		span { color: #929292; display: block; font-size: 14px; padding: 5px 0 0 0; }
	}	
	
	// Данные для проверки
	ul.form-data, ul.agreement { list-style: none; margin: 0; padding: 0;
		li {
			background: #F0F5F8; margin: 0 0 5px 0; padding: 15px; 
			border: 1px solid @lightgray; position: relative; overflow: hidden;
			span.left { font-style: normal; display: inline-block; width: 170px; }
			&.agreement span { position: relative; right: 45px; }
			&.insurance, &.agreement {
				background: #D2E1EA; color: #000; font-weight: normal !important;
				font-size: 11px;

				h4 { 
					padding-top: 10px; margin-top: 0; 
					font-weight: normal; font-size: 16px;
				}
				p { 
					display: block; padding: 0;
				}
				a {
					color: #000; text-decoration: underline;
				}
				span {
					float: right; display: inline-block; padding: 5px 10px;
					background: #F0F5F8; font-size: 20px; color: #979797; font-weight: normal;
					margin: 12px 0 0 0;
					label { 
						cursor: pointer; 
						i { 
							display: inline-block; font-style: normal;
							position: relative; top: 0px; font-weight: normal;
							i {
								display: inline-block; width: 30px; height: 30px; border: 1px solid #E3E8EA;
								background: #fff; border-radius: 3px; padding: 5px;
								position: relative; top: 7px;
								background: url(images/check_gray.png) no-repeat 5px center #fff; 
							}
						}
						input { display: none; }
						input:checked + i { 
							color: @yellow;
							i { 
								background: url(images/check_yellow.png) no-repeat 5px center #fff; 
								border-color: @yellow;
							}
						}
					}
					
				}		

			}
		}
	}
	
	.total { 
		background: #F0F5F8; padding: 15px 15px 15px 186px; font-weight: bold; color: @black; margin: 10px 0;
		font-size: 16px;
	}
	
	a.pay { 
		display: block; width: 250px; background: @yellow; padding: 10px; margin: 0 auto; 
		text-align: center; font-size: 18px; color: @black;
		&:hover { text-decoration: none; }
	}
	
}


// ========================================================================================
// = Шаг 4: Оплата ========================================================================

.payment { 
	
	> section { background: @white; padding: 25px 25px; .border-radius (@radius: 3px); }
	
	.form-filling .route_info;
	
	.route_info { 
		max-width: 1000px !important; background: #F0F5F8; border: 1px solid @lightgray; padding: 20px 0; 
		margin: 15px 0;
		table { width: 100% !important; }
	}
	
	.payment_error {
		color: red;
	}
	
	// Заголовок
	h1 { 
		display: block; font-size: 22px; color: @black; margin: 0 0 30px 0; 
		padding: 0; font-weight: normal; text-align: center;
		strong { color: @darkblue; }
		span { color: #929292; display: block; font-size: 14px; padding: 5px 0 0 0; }
	}	
	
	//Список билетов и багажных мест
	ul.cart { list-style: none; margin: 0; padding: 0;
		li {
			background: #F0F5F8; margin: 0 0 5px 0; padding: 15px; font-weight: bold;
			border: 1px solid @lightgray;
		}
	}
	
	.total { 
		background: #F0F5F8; padding: 15px; font-weight: bold; color: @black; margin: 10px 0;
	}
	
	.pay { 
		display: block; width: 250px; border: none; background: @yellow; padding: 10px; margin: 0 auto; 
		text-align: center; font-size: 18px; color: @black;
		&:hover { text-decoration: none; }
	}
	
	.uniteller {
		width: 234px; margin: 25px auto;
    text-align: center; color: #929292; font-size: 11px;
	}
	
	.uniteller_text { font-size: 9px; text-align: justify }
	
}


// ========================================================================================
// = Пользователь =========================================================================

// Страница авторизации


.authorization { position: relative; 
	.tabs-menu { 
		height: 30px; overflow: hidden;
		position: absolute; top: 0; margin: -30px 0 0 -40px;
		li {
		    height: 30px; line-height: 30px;
		    float: left;
		    margin-right: 10px;
		    background: #ccc; 
		    list-style: none;
		    
			&.current {
			    position: relative;
			    background-color: #fff;
			    border-bottom: 1px solid #fff;
			    z-index: 5;
			}
			
			a {
			    padding: 10px 20px;
			    color: #fff;
			    text-decoration: none; 
			}
			
			&.current a {
			    color: #2e7da3;
			}		    
		}		

	}
	
	.tab { overflow: hidden; padding: 30px 0; }
	.tab-content { display: none; }
		

	.login { 
		form { margin: 30px 0 0 0;
			input[name="pincode"], input[name="username"], input[name="password"] {
				background: none; border: none; border: 1px solid #E9EAED; 
				background: @white; .border-radius (@radius: 3px);
				width: 250px; height: 50px; line-height: 50px; padding: 0 20px; 
				font-size: 16px; outline: none; font-weight: normal; 
			}
			button[type="submit"] {
				background: none; border: none; border: 1px solid #E9EAED; 
				background: @white; .border-radius (@radius: 3px); 
				height: 50px; line-height: 50px; padding: 0 20px; font-size: 18px; 
				outline: none; font-weight: 500;
				position: relative; top: 2px; left: 2px;
				&:before { 
					content: "\f090"; font-family: FontAwesome; display: inline-block; 
					color: @yellow; padding: 0 10px 0 0; 
				}
			}		
		}
	}
		
}







// Сброс пароля
.reset_password { 
	
	form { margin: 30px 0 0 0;
		input[name="email"] {
			background: none; border: none; border: 1px solid #E9EAED; background: @white; .border-radius (@radius: 3px);
			width: 370px; height: 50px; line-height: 50px; padding: 0 20px; font-size: 16px; outline: none; font-weight: normal; 
		}
		button[type="submit"] {
			background: none; border: none; border: 1px solid #E9EAED; background: @white; .border-radius (@radius: 3px); 
			height: 50px; line-height: 50px; padding: 0 20px; font-size: 18px; outline: none; font-weight: 500;
			position: relative; top: 2px; left: 2px;
			&:before { 
				content: "\f1d8"; font-family: FontAwesome; display: inline-block; color: @yellow; padding: 0 10px 0 0; 
			}
		}		
	}
		
}

.password_recovery_instructions {
	display: block;
    padding: 5px;
    background: #F16500;
    color: #fff;
    width: 600px;
    margin: 20px auto 0 auto;
    text-align: center;
}

// Шапка личного кабинета
.user_header { 
	> section { width: 1000px; margin: 0 auto; position: relative; height: 100px; z-index: 100; }
	height: 100px; width: 100%; background: url(images/user.header.png) no-repeat center bottom #34689A;
	position: absolute; left: 0; margin-top: -27px;
	.title { color: @white; font-size: 22px; font-weight: 200; padding: 35px 0 0 0; }
	ul { position: absolute; right: 0; bottom: 0; list-style: none; margin: 0; padding: 0; 
		li { float: left; 
			a { 
				color: @white; display: inline-block; background: rgba(97, 151, 202, 0.81); padding: 10px 15px;
				margin: 0 1px 0 0; font-size: 13px; position: relative; bottom: -2px;
				&.active { 
					background: #F0F5F9; .border-radius (@radius: 3px 3px 0 0); color: @black; 
					padding-top: 12px; bottom: 0;
				}
			}
		}
	}
} 
.wide_content.to_bottom { padding: 105px 0 0 0; position: relative;  } 
.wide_content.no_padding > section { padding: 0 !important; text-align: left !important; }


// Форма ввода пароля
.wide_content {
	.login{
		form { margin: 30px 0 0 0;
			input[name="pincode"] {
				background: none; border: none; border: 1px solid #E9EAED; background: @white; .border-radius (@radius: 3px);
				width: 250px; height: 50px; line-height: 50px; padding: 0 20px; font-size: 16px; outline: none; font-weight: normal; 
			}
			button[type="submit"] {
				background: none; border: none; border: 1px solid #E9EAED; background: @white; .border-radius (@radius: 3px); 
				height: 50px; line-height: 50px; padding: 0 20px; font-size: 18px; outline: none; font-weight: 500;
				position: relative; top: 2px; left: 2px;
				&:before { 
					content: "\f090"; font-family: FontAwesome; display: inline-block; color: @yellow; padding: 0 10px 0 0; 
				}
			}		
		}
	}
}


// Страница «Мои билеты»
.user.sorting { border-bottom: 2px solid #F0F5F8; 
	.last.price { margin-left: 335px !important; }
}

ul.user.tickets {  
	text-align: left; position: relative; top: -3px;
	li { cursor: default !important;
		&.active, &.active li { cursor: pointer !important; }
		.wide { width: 95%; margin: 0 auto; text-align: left; padding: 0 0 3px 0; }
		.ticket_options {
			display: table; text-align: center; margin: 10px auto 0 auto;
			list-style: none; padding: 0; overflow: hidden; width: 97%;
			table-layout: fixed;
			li {
				margin: 0 0 13px 0; font-size: 13px; text-transform: uppercase; display: table-cell;
				padding: 0 10px;
			}
			span {
				color: #fff; padding: 7px 20px 7px 15px; text-align: center; min-width: 100%;
				line-height: 30px; display: inline-block; font-size: 16px; position: relative; margin: 0 0 0 0;
				border: 1px solid @yellow; border-radius: 3px; background: @white; color: @black;	
				text-transform: none; 
				&.green { background: #6ACA6C; color: @white; border-color: #6ACA6C; }
				&.yellow { background: #FABA2D; color: @white; border-color: #FABA2D; }
				&.pink { background: #FB6869; color: @white; border-color: #FB6869; }
				&.red { background: #F90F1D; color: @white; border-color: #F90F1D; }
			}
			a.refund_ticket, a.refund_insurance {
				color: #fff; padding: 7px 20px 7px 15px; text-align: center; min-width: 100%;
				line-height: 30px; display: inline-block; font-size: 16px; position: relative; margin: 0 0 0 10px;
				border: 1px solid @yellow; border-radius: 3px; background: @white; color: @black;	
				text-transform: none; width: 100% !important; margin: 0 !important; left: 0 !important;
				&:before { font-family: FontAwesome; content: "\f01e"; padding: 0 10px 0 0; color: @yellow; font-size: 20px; }
				&:hover { text-decoration: none; background: #fffaeb }
				
				&.refund_insurance { &:before { color: #96E26F; } border-color: #96E26F; }
			}			
		}
		
		// Кнопка «Печать»
		.print_ticket, a.print_insurance { 
			color: #fff; padding: 7px 20px 7px 15px; text-align: center; font-weight: 500; float: right;
			line-height: 30px; display: inline-block; font-size: 16px; position: relative; top: 0;
			font-weight: normal; margin: 0; width: 100%;
			border: 1px solid @yellow; border-radius: 3px; background: @white; color: @black; 
			cursor: pointer; text-decoration: none; text-transform: lowercase; text-transform: capitalize;
			&:hover { text-decoration: none; background: #fffaeb }
			&:before { font-family: FontAwesome; content: "\f02f"; padding: 0 10px 0 0; color: @yellow; font-size: 20px; }
			//&.print_ticket:hover { background: @yellow; color: @white; text-decoration: none; &:before { color: @white; } }
			&.print_insurance { &:before { color: #96E26F; } border-color: #96E26F; }
		}	
							
	}
	
	b { font-weight: normal; }
}

// Пагинация
ul.pagination.wide {
	width: 100%; text-align: center; position: relative; min-height: 56px; background: @white; 
	margin: -8px 0 0 0; bottom: -5px; width: 100%;
	li { display: inline-block;
		&.back {
			position: absolute; left: 0;
		}
		&.forward {
			position: absolute; right: 0;
		}		
		
		a { 
			border: none; font-size: 17px; font-weight: 300; padding: 15px 20px; 
			display: inline-block; border-bottom: 2px solid @white; .border-radius (@radius: 0px);
			&:hover, &.active { 
				color: @black; background: none; border-bottom: 2px solid @yellow;
			}
			&.active { cursor: default; }
		}
	}
}

// Профиль
.profile {
	text-align: left !important;
	ul { text-align: left; }
	ul.forms>li { border-top: 1px solid #E3E8ED; .border-radius (@radius: 3px); }
	a.prev { border: none !important; &:hover { color: red; } }
	
	// Действия
	.actions {
		text-align: center; 
		button { 
			display: inline-block; background: none; border: none; border: 2px solid #F0F5F8; 
			.border-radius (@radius: 3px); padding: 10px 15px; font-size: 18px; color: @link; outline: none;
			&:first-child { margin-right: 30px; color: red; }
			&:last-child {
				text-decoration: none; border: 2px solid @darkblue; color: @black;
			}
			&:hover { text-decoration: none; }
		}
	}

	.password_wrapper {
		position: relative;
		input[name=password] { 
			background: @white; width: 120px !important; .placeholder(); 
		}
		.toggle_password {
			position: relative; right: 35px; top: 0; color: @blue; 
		}		
	}	
	
}


// Страница возврата
.form-filling.refund {
	margin: 25px 0 0 0;
	.top {
		padding: 0 20px;
		h1 { font-size: 24px; padding: 0 0 7px 0; margin: 0; }
		p { padding: 5px 0; }
	}
	
	span.select {
		line-height: 100%; 
	}
	
	span.link_to_doc {
		display: block; width: 400px; text-align: center;
		margin: 0 auto; padding: 20px 0 10px 0;
		a { float: right; padding: 0 0 0 10px }
	}
	
	ul.cause { width: 100%; 
		li { overflow: hidden; float: none; width: 750px; padding: 0 !important;
			label { display: inline-block; margin: 0 10px 10px 0;
				span { 
					display: inline-block; background: @white; padding: 8px 11px; width: inherit;
					border: 1px solid #E3E8EA; .border-radius (@radius: 3px);
					&:before {
						content: "\f00c"; font-family: FontAwesome; padding: 0 5px 0 0;
					}
				}
				input[type=radio] { display: none; }
				input[type=radio]:checked+span { 
					background: @yellow; color: @white;
					&:before { color: @white; }
				}
				input[type=text] { width: 522px; display: inline-block; margin: 0 0 0 10px; position: relative; top: 1px; }
				.parsley-error + span { border-color: red; }
			}
		}
	}
	
	.print {
		color: #fff; padding: 7px 25px; text-align: center; font-weight: 500; float: right;
		line-height: 30px; display: inline-block; font-size: 18px; position: relative; margin: -55px 0 0 0;
		border: 1px solid @blue; .border-radius (@radius: 3px); background: @white; color: @black;
	}
	
	ul.files {
		li {
			position: relative; width: 100%; padding: 0 !important;
			input[type=text]:disabled { border: 1px solid #E3E8EA; width: 300px; font-size: 14px; }
			
			.fileupload {
			  background: #fff; display: inline-block; padding: 0; border: 1px solid #E3E8EA;
			  position: relative; overflow: hidden; position: absolute; top: 0; margin-left: -4px;
			  .border-radius (@radius: 3px 3px 0 0); 
			  i { 
				  font-style: normal; padding: 8px; display: inline-block; 
			  }
				input.upload {
				  position: absolute;
				  top: 0; right: 0; margin: 0; padding: 0; font-size: 20px;
				  cursor: pointer; opacity: 0; filter: alpha(opacity=0);
				}				  
			}
			
			.required { color: red; position: absolute; top: 0; right: 0; margin: 8px 150px 0 0; }
		
		}
	}
	
	// Действия
	.actions {
		text-align: center; background: @white; padding: 0 0 30px 0;
		button { 
			display: inline-block; background: none; border: none; border: 2px solid #F0F5F8; 
			.border-radius (@radius: 3px); padding: 10px 15px; font-size: 18px; color: @link; outline: none;
			text-decoration: none; border: 2px solid @darkblue; color: @black;
			&:hover { text-decoration: none; }
		}
		a { 
			display: inline-block; background: none; border: none; border: 2px solid #F0F5F8; 
			.border-radius (@radius: 3px); padding: 10px 15px; font-size: 18px; color: @link; outline: none;
			margin-right: 30px; color: red;
			&:hover { text-decoration: none; }
		}		
	}	
	
	
}


// ========================================================================================
// = Разное ===============================================================================

// Главная страница
.wide_content.mainpage {
	//padding: 220px 0 0 0;
	padding: 0 0 0 0;
		z-index: 100;

	// Слайдер
	.swiper-container {
	  width: 1100px; margin: 20px auto 20px auto !important; height: 200px;
	  border: 1px solid #ccc;
	    overflow: visible !important;

	  //.swiper-button-prev { }
	}
	.swiper-slide {
	  background-position: center; background-size: cover;z-index: 2;
	    overflow: visible !important;

	}	

		
}

.mainpage-columns {
	aside {
    	padding: 0 !important; margin: 0 !important;
	}
}

//ul.advantages {
//	list-style: none; margin: 0; padding: 10px 0; overflow: hidden;
//	li {
//		 padding-left: 40px; width: 65%; display: inline-block; float: left;
//		 background: url('media/checkicon.png') left top no-repeat;
//		 height: 145px; margin: 50px 30px 50px 0;
//	}
//}

// Главная страница -> Преимущества
ul.advantages {
	list-style: none; 
	margin: 50px 0 0 0; /* Сдвигаем от заголовка "Популярные направления" */
	padding: 0;
	overflow: visible; // overflow: hidden здесь ломал высоту раньше
	
	display: flex;
	flex-wrap: wrap;
	gap: 30px; /* Отступы между пунктами вместо margin-right/margin-bottom */

	li {
		flex: 1 1 calc(50% - 15px); /* Занимает 2 колонки минус половина gap */
        padding-left: 40px; 
		min-height: 145px; /* Заменяем фиксированную высоту на минимальную */
		background: url('media/checkicon.png') left top no-repeat;
		box-sizing: border-box; /* Чтобы паддинг слева не вылезал за ширину */
		
		&:nth-child(even) {
			margin-right: 0; /* Обнуляем правый отступ у четных элементов через gap/flex */
		}
	}
}


// Страница расписания
table.timetable { width: 100%; 
	td { border-color: @orange !important; }
	tr.top td { 
		background: @blue; color: white; font-size: 14px !important; font-weight: bold; 
	}	
	tr.normal { cursor: pointer;
		td { font-size: 18px !important; vertical-align: top; }
		td:nth-child(1),td:nth-child(2) { border-right-color: white; }
		span.info {
			background-color: #f26500; color: #ffffff; padding: 2px 3px 2px 3px; font-size: 12px; cursor: pointer;
		}
	}
	tr.info { display: none;
		> td { border-right-color: @orange !important; font-size: 14px !important; }
		tr.top td { border-color: @orange; background: @orange; color: white; font-weight: normal; }
		table { width: 100%; 
			td { font-size: 14px !important; }
			td:nth-child(1),td:nth-child(2) { border-right-color: @orange; }
			td:last-child { text-align: center; }
			a { padding: 4px 6px; display: inline-block; background: @blue; color: white; line-height: 100%;
				&:hover { text-decoration: underline; color: white;  }
			}
		}
	}
}

// Форма обратной связи
form.feedback {
	color: @blue; font-size: 14px; background: #F8F8F8; padding: 20px; width: 400px;
	.title { font-size: 18px; padding: 0 0 20px 0; }
	label { display: block !important; 
		span { color: #999; font-weight: normal; }
	}
	input[type=text],input[type=email],textarea {  
		outline: none; .border-radius (@radius: 0px);
		border: 1px solid @blue; resize: none;
	}		
	.info_about_contact { color: #999; padding: 0 0 10px 0;  font-size: 12px; }
	
	input[type=submit] { 
		display: block; width: 100%; margin: 0; padding: 15px; text-align: center; 
		background: @blue; color: #fff; border: none; font-size: 18px;
	}
	
}


