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

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


// Плейсхолдеры
.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;
	
	
// ========================================================================================
// = Мобильная версия =====================================================================

.only_mobile { display: none !important; }
html.mobile body {
    min-width: 200px !important;
}

.full-version {
    background: @darkblue;
    color: #fff;
    padding: 10px 0;
    text-align: center;
    cursor: pointer;
}
 
html.mobile {
	
	// Базовое
	.only_mobile { display: block !important;  }
	.social { border-top: 1px solid @blue; padding-top: 10px; }
	.only_standard { display: none !important; }
	
	footer,.centered,aside,.breadcrumbs,.push { display: none !important; }
	
	section.columns { width: 100%; padding: 0 !important; display: block;  }
	
	.mobile_wide { width: 104%; position: relative; left: -2%; }
	
	.mobile_padding { padding-left: 3%; padding-right: 3%; }
	
	.wrapper.wide { 
		section { margin: 0 !important; }
	}
	.wide_content.mainpage { display: none; }
	
	.attention { background: red; color: #fff; padding: 5px; text-align: center; }
	
	.login-link {
	  background: #375e80; padding: 15px 0; text-align: center; color: white;
	  border: 1px solid #577498; border-right: none; border-left: none;
	  font-size: 16px;
	}
	
	section.wide_content {
		padding: 0 0 !important; width: 100%; max-width: 100%; overflow: hidden;
	}
	.mobile_content { padding: 0 3%; }
	.content { 
		display: block !important; width: 100% !important; 
		max-width: 100% !important; 
		p {  max-width: 100% !important; text-align: left !important; }
		li { text-align: left; }
		> section { padding: 0 2% !important; width: 100%; max-width: 100%; overflow: hidden; display: block; }
		img { 
			width: 104%; position: relative; left: -2%; padding: 10px 0 !important; float: none !important;
			border: 0 !important; background: none !important; height: auto !important;
		}
		td img { width: 100%; right: 0; }
		h1,h2,h3 { text-align: center; }
		h1 { padding: 20px 0 0 0 !important; }
		
		form.feedback { .mobile_wide; }
	}
	
	.mainpage_top { 
		width: 100% !important; display: none;
		.links { display: none; }
	}
	
	table { max-width: 100% !important; width: 100% !important;
		img { width: 100% !important; }
	}
	
	aside,.content { display: block; float: none; padding: 0 !important; }
	
	.swiper-container {
	  width: 100%; margin: 0 auto 20px auto !important;
	  height: 200px; display: none;
	}
	.swiper-slide {
	  background-position: center;
	  background-size: cover;	
	}
	

	// Шапка
	header {
		background: #375E80; max-height: 65px; height: 65px; color: #fff; width: 100%; max-width: 100%;
		> section {
			width: 100; max-width: 100%; height: 65px; 
		}
		// Логотип
		.logo {
			display: block; width: 190px; height: 65px; float: left; padding: 10px 0 0 0;
			background: url(images/logo.png) no-repeat right top; margin: 0 0 0 15px;; font-weight: bolder; 
			background-size: 26px 36px; background-position-y: 10px;
			font-size: 26px; line-height: 140%; text-decoration: none; color: #fff; position: relative; top: 4px;
			&:hover { color: #fff; text-decoration: none; }
			span:first-child { font-weight: bold; }
			span:last-child { font-weight: 100;  }
		}	
		
		// Мобильное меню	
		i.menu { 
			float: right; font-size: 20px; background: #4375A1; display: inline-block; 
			padding: 10px; margin: 10px 10px 0 0; cursor: pointer;
		}
		nav { 
			z-index: 200; display: none;
			position: absolute; top: 0; margin: 65px 0 0 0;
			background: #375E80; width: 100% !important;
			
			> section { width: 100%; padding: 0 !important; 
				> ul { 
					list-style: none; padding: 0 0 0 0; margin: 0; width: 100%; display: block;
					background: red; 
					> li { 
						display: block; background: #375E80; position: relative; border-bottom: none;
						padding: 0 20px !important; width: 100%; 
						
						&.cabinet { 
    						border-top: 2px solid #56739A; 
    						&.welcome { 
        						padding-top: 10px !important;
        						span { color: @yellow } 
    						}
						}
					
						&.active, &:hover { 
							background: #355D81; border-bottom: none !important; width: 100% !important; 
							a { width: 100% !important; background: #355D81; }
						} 
						
						> a {
							font-size: 16px; color: #fff; font-weight: 400 !important;
							display: inline-block; height: 44px; text-align: left; padding: 18px 0; line-height: 80%;
							margin: 0; width: 100% !important; border-bottom: 1px solid #436e93 !important; background: #355D81;
							
						}
						&:last-child a { padding-bottom: 30px; }
						a:hover, &.active > a { 
							color: #fff; text-decoration: none; background: none !important; 
							border-bottom: 1px solid #436e93 !important;
						}				
						
						&.last a, &:last-child a { border: none !important; }
						&.last a { padding-bottom: 10px; }
						
						i.show-inner { 
							position: absolute; top: 5px; right: 24px; font-size: 18px; color: #AEC6D7; 
							padding: 8px 10px; display: inline-block; cursor: pointer;
							&:hover { background: #396a93; }
						}						
						
						// Второй уровень
						&:hover ul { display: block; }
						ul { 
							position: relative; z-index: 200; margin: 0px 0 0 0; padding: 0; width: 100%;
							background: repeat-x @darkblue; display: none;
							li {  
								list-style: none; 
								a {
									color: #fff; display: block; font-size: 12px;
									padding: 10px 20px;
								}
								a:hover, &.active a { background: @blue !important; }
								&:last-child a { padding-bottom: 10px; }
							}
						}
					}
				}
			}

		}
	}
	
	// Главная
	
	ul.advantages {
		list-style: none; margin: 0; padding: 10px 0; overflow: hidden;
		li {
			 padding: 35px 0 0 2px; width: 100%; display: block; float: none;
			 background: url('media/checkicon.png') left top no-repeat;
			 height: auto; margin: 10px 30px 30px 0; position: relative; left: -2px;
		}
	}	
	
	input { border-radius: 0; box-shadow: none; -webkit-appearance: none; }
	
	// Поиск билетов
	.search { height: auto; 
		.mobile_wide;
		padding: 6%; color: black; background-repeat: repeat; // color: black; цвет шрифта названия станций отправления
		margin-top: 0px;  margin-right: 2px;
		min-width: 200px !important;
		
		h3 { font-size: 22px !important; padding: 10px 0 !important; margin: 0 0 -40px 0; 
			color: #fff; text-align: center;
		}
		
		label { display: block; margin: 10px 0 !important; }
		
		// Дата
		label.date { position: relative;
			&:before { 
				content: ""; background: url('images/select_mobile.png') no-repeat left top;
				width: 13px; height: 8px; display: block; position: absolute; right: 0; margin: 15px 16px 0 0;
			}
		}
		input[name=departure_date] { 
			height: 42px; border: 1px solid #D8E0E3; width: 100%; padding: 0 3%; outline: none; 
			.placeholder(#9AB0C8,16px); color: #9AB0C8;
		}
		.date-control { text-align: center !important; padding: 4px 0 10px 0; 
			display: table; table-layout: auto; width: auto; 
			margin: 20px auto 20px auto; 
			li { display: table-cell; text-align: left !important; padding: 0 10px;
				
				&:nth-child(1),&:nth-child(2) { border-right: 1px solid #D9E3E9; }
			}
			a { 
				font-size: 15px; color: #fff !important; text-decoration: none; font-weight: bold !important; 
				display: block;
			}
			span { padding: 0 10px; font-size: 10px; }
		}
		
			// Количество билетов
label.number_of_seats {
    position: relative;
    span.title {
        float: none;
        line-height: 40px;
        font-weight: 500;
        color: white;
        padding-left: 24px;
    }
    span.select {
        width: 100%;
        display: inline-block;
    }
    .choices__input, .choices__list--single div {
        padding-left: 25px;
    }
    .choices__input {
        color: gray;
    }
}
		
		// Кнопка отправки
		button[type=submit] { 
			display: block; background: none; border: none; overflow: hidden; padding: 20px 0;
			background: @orange; position: relative; width: 100%;
			border-radius: 10px; margin: 20px 0 20px 0;
			span { 
				font-size: 22px; text-align: center;
			}
			&:hover span { border-bottom: 2px dotted #fff; }
			i { padding-right: 10px; color: #F5A381; display: none; }
		}
		&.has_results {
			background: #F1F6F9; padding-bottom: 0 !important;
			.date-control a { color: @darkblue !important; font-weight: normal !important; }
			h3 { color: @darkblue; }
			button[type=submit]{
				width: 108%; margin: 20px 0 20px -4%; border-radius: 0 !important;
			}
		}
	}
	
	// Ширина календаря
	div.xdsoft_datepicker.active { width: 222px !important; top: -2px; position: relative; }
	.xdsoft_datetimepicker { border: 2px solid #315B83 !important; }
	
	// Замена стилей выпадащих списков
		// Замена стилей выпадатых списков
.choices__input {
  border-radius: none !important;
}
 
.choices__list--single,
.choices__input,
.choices__inner {
  line-height: 34px !important;
  border-width: 1px !important;
  border-radius: 0 !important;
  background: #fff !important;
  border-color: #D8E0E3 !important;
  color: #000001 !important;
  font-size: 16px !important;
  font-weight: normal !important;
}

.choices__list--single::after {
  content: '';
  display: inline-block;
  width: 13px;
  height: 8px;
  background: url('images/select_mobile.png') no-repeat left top !important;
												  
  border: none !important;
  top: 24px !important;
}

.choices__list--single.is-open::after {
  content: '';
  background: url('images/select_mobile.png') no-repeat right bottom !important;
  width: 13px;
  height: 8px;
  border: none !important;
  
}

.choices__input input {
  font-size: 14px !important;
  color: #000001;
}

.choices__input input::-webkit-input-placeholder {
  color: #000001;
  font-size: 16px;
  line-height: 140%;
  font-weight: normal;
}

.choices__input input:-moz-placeholder {
  color: #000001;
  font-size: 16px;
  font-weight: normal;
} 

.choices__input input::-moz-placeholder {
  color: #000001;
  font-size: 16px;
  font-weight: normal;
}

.choices__input input:-ms-input-placeholder {
  color: #000001;
  font-size: 16px;
  line-height: 140%;
  font-weight: normal;
}

.choices__input input,
input[name=departure_date],
.choices__input div {
  font-family: @opensans, FontAwesome !important;
  min-width: 100px !important;
  font-size: 16px !important;
  font-weight: normal !important;
}

input[name=departure_date] {
  padding-top: 25px !important;
  padding-bottom: 25px !important;
}

label.dispatch_station,
label.arrival_station,
label.departure_date {
  .choices__input.dropdown-active {
    div,
    input {
						   
      outline: none !important;
      border: none !important;
    }
  }

  .choices__input:before {
    font-family: FontAwesome;
    padding: 0 10px 0 10px;
    position: relative;
    left: -5px;
    min-width: 40px;
    display: inline-block;
    color: #4474A2;
    z-index: 10;
  }

  &.dispatch_station .choices__input:before {
    content: '';
    background: url('images/ico_mob_change.png') no-repeat;
    width: 12px;
    height: 11px;
    left: 10px;
  }

  &.arrival_station .choices__input:before {
    content: '';
    background: url('images/ico_mob_pin.png') no-repeat;
    width: 12px;
    height: 17px;
    left: 10px;
    top: 4px;
	
  }

  &.arrival_station .choices__input {
    height: 52px !important;

  }

  &.arrival_station .choices__input input {
    line-height: 34px !important;
    position: relative !important;
    display: block;
    overflow: hidden;
    top: 0px;
    padding: 0 !important;
    line-height: 110% !important;
	
  }

  &.departure_date {
    &:before {
      content: '';
      background: url('images/ico_mob_time.png') no-repeat;
      position: absolute;
      width: 16px;
      height: 17px;
      left: 18px;
      top: 4px;
      min-width: 40px;
      display: inline-block;
      color: #4474A2;
    }

    input {
      padding-left: 49px;
    }
  }
}

label.number_of_seats .choices__input:before {
  font-family: FontAwesome;
  padding: 0 10px 0 0;
  position: relative;
  display: inline-block;
  content: '';
  background: url('images/ico_mob_user.png') no-repeat;
  width: 14px;
  height: 14px;
  left: -7px;
  top: 2px;
}

/* Завершение файла стилей */
	
	// Найдено билетов
	.quantity {
		color: #000 !important; position: relative !important; 
		text-align: center; margin: 0 0 10px 0 !important; font-size: 17px;
		display: block;
	}
	
	// Сортировка билетов в блоке поиска
	.search_sorting {
		position: relative !important; bottom: 0; right: 0; margin: 0 0 0 0; text-align: center;
		
		.title { color: @lightblue; font-size: 12px; display: block !important; 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: 11px !important; 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: 20px 0 20px 0; list-style: none; padding: 0; overflow: hidden; display: table; table-layout: auto;
	width: 100%; text-align: left;
	&.normal { margin: 20px 0; }
	li { 
		display: table-cell; font-size: 18px; color: @gray; padding: 0 0; position: relative; 
		&:before {
			width: 35px; height: 35px; text-align: center; line-height: 100%; color: black;
			border-radius: 0 !important; border: 0; display: block; position: relative;
			margin: 0 14px 0 0; background: @yellow; border-left: 1px solid #DCA626;
			height: 100% !important; width: 100%; padding: 14px 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"; }
		span { display: none; }
		
		&.active { 
			background: @yellow; color: @black; font-weight: 500; border-radius: 0 !important;
			padding: 0 10px; border-left: 1px solid #DCA626; text-align: center;
			span { display: inline-block; }
			&: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; width: 45px !important; 
			padding: 10px 0;
			span { display: none; }
			&:after { 
				display: none;
			}			
			&:before { color: #000; font-weight: normal; }
			&: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"; }			
		}		
		
	}
}		

// Билеты

ul.tickets {
	> li { .mobile_wide; padding: 20px 3% 0 3%;
		.info.technical { display: none !important; } 
		&.disabled { 
			.price_line { display: none !important; } 
		}
		ul.row { list-style: none; margin: 0; padding: 0;
			li {
				.date { font-size: 14px; color: #949494; position: relative; display: block; margin: 0 0 -7px 0; }
				.mobile_padding;
				&.on_the_way {
					padding: 12px 0; overflow: hidden;
					i.wayline {
						height: 44px; width: 2px; background: @orange; display: block; float: left; margin: 0 20px 0 25px;
						position: relative;
						&:before {  
							display: block; width: 8px; height: 8px; border-radius: 50%; background: @orange; 
							content: ""; position: absolute; top: 0; left: 0; margin: -5px 0 0 -3px;
						}
						&:after {  
							display: block; width: 8px; height: 8px; border-radius: 50%; background: @orange; 
							content: ""; position: absolute; bottom: 0; left: 0; margin: 0 0 -5px -3px;
						}						
					}	
					.large { font-weight: bold; font-size: 16px; margin: -4px 0 0 0; color: #000; }				
				}

			}
		}
		
		ul.info { margin: 20px 0 40px 0; padding: 0;
			li {
				.mobile_padding;
				float: none; font-size: 13px; margin-bottom: 10px;
				&:after { display: none; }
			}
		}
		
		ul.price_line {
			background: @orange; color: #fff; margin-left: -2%; width: 104%;
			font-size: 16px; font-weight: bold; display: table !important; table-layout: fixed;
			padding: 0 !important;
			li { padding: 15px 0; display: table-cell !important; 
				&:nth-child(1) {
					font-size: 18px; border-right: 1px solid #F5A37E; 
					width: 30%; text-align: center;
					//i { color: #e18860; }
				}
				&:nth-child(2) {
					text-align: center; 
					i { color: #F5A37E; padding: 0 10px 0 0; }
				}				
			}
		}
		
		&:hover ul.price_line li:nth-child(2) { color: @yellow; }
	}
}

// Ссылки между шагами
.nav_links {
	text-align: center; padding: 30px 0 20px 0;
	a { 
		display: inline-block; border: 2px solid #F0F5F8; .border-radius (@radius: 3px);
		padding: 10px 15px; font-size: 14px;
		&.prev { margin-right: 30px; }
		&.next {
			text-decoration: none; border: 2px solid @darkblue; color: @black;
		}
		&:hover { text-decoration: none; }
	}
}
	
	// Схема автобуса
.seats {  
	> section { background: @white; text-align: center; padding: 25px 0; .border-radius (@radius: 0 0 3px 3px); }
	.mobile_wide;
	
	// Заголовок
	h1 { 
		display: block; font-size: 16px !important; color: @black; margin: 0; padding: 0; font-weight: normal;
		text-align: center; padding: 0 0 20px 0 !important;
		strong { color: @darkblue; margin-right: 20px; &:nth-child(2) { margin: 0; } }
		span { 
			color: #929292; display: block; font-size: 14px; padding: 5px 0 0 0; width: 80%; 
			margin: 0 auto;
		}
	}
	
	// Схема автобуса
	.scheme { 
		height: auto; position: relative; display: inline-block;
		margin: 20px auto 40px auto; padding: 25px; 
		border: 2px solid #C5C5C5; border-radius: 15px;
		
		background: none;
		&:after { 
			display: none;
		}
		
		.error { max-width: 200px; top: -15px; position: relative; }
		.bus_preloader { max-width: 200px; }
		
		section.outer { display: inline-block; text-align: left; }		
		section { 
			overflow: inherit;
			
			div { margin: 0 0 15px 0; display: block;  height: 34px !important; 
				label { display: inline-block; cursor: pointer; padding: 7px;  }
				span {
					display: block; text-align: center; margin: 0 0 0 0; color: #000; 
					font-weight: bold; padding: 0 0 0 0; border-radius: 50%; 
					background: #DF8788; width: 35px; height: 34px; line-height: 34px; 
					&.active { color: #31702d; background: #98E08D; cursor: pointer; }
					&.empty { background: none !important; }
				}
				input:checked + span { background: #F3C454; color: #876721 !important; }
				input { display: none; }		
				&:last-child { margin: 40px 0 0 0; }		
			}		
			

		}
	}
	
	// Сообщение пользователю
	.status_message { position: relative; top: -20px; 
		span.clear { color: @link; border-bottom: 1px dashed @link; cursor: pointer; }
	}
	
	// Подсказка на синем фоне
	.hint { 
		background: @darkblue; padding: 20px 3%; text-align: center; margin: 0 0 -25px 0;
		color: @white; .border-radius (@radius: 0 0 3px 3px); 
	}
}



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

.form-filling {
	
	overflow: hidden;
	
	> section { 
		background: @white; padding: 25px 0 0 0; border: 0; 
		border-top: 1px solid #E4EAED; max-width: 100%; 
	}
	
	// Очистка формы
	.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 3%; border-bottom: 0; margin: 0 0 0 0; 
		 
		ul.row { list-style: none; margin: 0; padding: 0;
			li {
				.date { font-size: 14px; color: #949494; position: relative; display: block; margin: 0 0 -7px 0; }
				
				&.on_the_way {
					padding: 12px 0; overflow: hidden;
					i.wayline {
						height: 44px; width: 2px; background: @orange; display: block; float: left; margin: 0 20px 0 25px;
						position: relative;
						&:before {  
							display: block; width: 8px; height: 8px; border-radius: 50%; background: @orange; 
							content: ""; position: absolute; top: 0; left: 0; margin: -5px 0 0 -3px;
						}
						&:after {  
							display: block; width: 8px; height: 8px; border-radius: 50%; background: @orange; 
							content: ""; position: absolute; bottom: 0; left: 0; margin: 0 0 -5px -3px;
						}						
					}	
					.large { font-weight: bold; font-size: 16px; margin: -4px 0 0 0; color: #000; }				
				}

			}
		}
		
		ul.info { margin: 20px 0 10px 0; padding: 0;
			li {
				float: none; font-size: 13px; margin-bottom: 10px;
				&:after { display: none; }
			}
		}
		
	} //.данные рейса
	
	// Статус пользователя
	.user_info {
		display: none;
	}
	
			
	// Список пассажиров
	ul.forms {
		display: block; list-style: none; margin: 0; padding: 0; 
		background: #F7FBFC; border: 0; max-width: 100%;
		> li {
			padding: 0; color: @gray; border-bottom: 3px solid @lightgray;
			// Номер места
			h3 { 
				margin: 0; padding: 15px 3%; font-size: 17px; background: #E4EDF2; position: relative;
				display: block; overflow: hidden; font-weight: bold; width: 100%; color: #000;
				.toggle {
					font-style: normal; float: right; font-weight: normal; font-size: 14px; color: #2B597E;
					display: inline-block; position: absolute; top: 0; right: 0;
					padding: 15px 3%; cursor: pointer; margin: 1px 0 0 0;
				}				
			}
			// Разбивка на колонки
			ul { margin: 0; padding: 25px 0; list-style: none;  display: inline-block; width: 100%;
				li { float: none; width: 100%; padding: 0 4% !important; } 
				li:nth-child(2) { margin: 0px 0 0 0; }
			}
			

			
		}
				
	}
	
	.email-spam-message {
    	padding: 0 !important;
	}
	
	
	
	
			// Паспорт
			div.label.passport { 
				text-align: left; padding: 0 !important; margin: 0 0 15px 0; overflow: hidden; 
			}
						
			// Одно поле
			label, div.label { display: block; font-weight: 400; color: @gray; font-size: 14px;
				padding-bottom: 15px;
				&.select { position: relative; margin: 0 0 0 0; 
					span { position: relative; top: 0px !important; }
				}
				// Заголовок поля
				span { width: 100%; display: block; color: #376998; padding: 5px 5px;
					&.select { position: relative; top: -14px; }
				}
				
				// Пол
				section.gender { overflow: hidden; 
					// Блок радио-кнопок
					label { display: inline-block; cursor: pointer; width: 49%; float: left;
						
						&:nth-child(2) { float: right; }
						
						input[type=radio] { display: none; }
						b { 
							font-weight: normal; display: inline-block; height: 38px; width: 100%;
							border: 1px solid #E3E8EA; .border-radius (@radius: 3px); padding: 0 15px 0 0; line-height: 38px;
							background: @white; position: relative; text-align: center; color: #375E81;
							&:before { 
								background: none; width: 19px; height: 13px; content: "\f058"; color: #D7DFE6;
								position: relative; top: 0; left: 0; margin: 0 10px 0 0; font-family: FontAwesome;
							}
						}
						input[type=radio]:checked + b:before { color: @yellow; }
						input[type=radio].parsley-success:checked + b { border-color: green; }
						input[type=radio].parsley-error + b { border-color: red; }
					}
				}
								
				section { display: inline-block; width: 100%; height: 38px; }
				
				// Текстовое поле
				input[type=text],input[type=email] { 
					width: 100%; 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: 50%; }
				input[name=number] { width: 49%; z-index: 200; }
				input[name=series],input[name=number] {
					.placeholder (#9AA9B9, 14px, 24px); font-weight: 500;
					text-align: center;					
				}
				

				
				// Телефон
				input[name=phone].enabled { padding-left: 101px; }
				.intl-tel-input { width: 100%;  }
				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; padding: 0 !important;
					li { float: none !important; width: auto !important; overflow: hidden;
						&:nth-child(1) .flag-box { margin-left: 0; margin-top: -2px !important; }
						&:nth-child(2) .flag-box { margin-left: 0; margin-top: -2px !important; }
					}
					.flag-box { float: left; position: relative; top: 10px; }
					.country-name { max-width: 180px; overflow: hidden; float: left; }
				}				
				
				input:disabled, input:disabled:checked+b { border-color: green; opacity: 0.5 }
				input:disabled+b { opacity: 0.5 }
				
				// Выбор даты
				input.date { 
					width: 100%; outline: none; 
					font-weight: bold; font-size: 16px; padding: 0 35px 0 15px;
					background: @white url(images/ico_calendar2.png) no-repeat 97% 8px;
					.placeholder (#808080, 14px, 24px); font-weight: 500;
				}
				
			// Национальность и документы
			/* Мобильная версия сайта */
@media screen and (max-width: 768px) {
    /* Главный элемент выбора */
    .choices {
        width: 100%; /* заполним всю ширину экрана */
        height: 46px;
        line-height: 46px; /* выровняем текст по центру */
        font-size: 16px;
        font-weight: bold;
		color: black; /* Черный цвет шрифта */
        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;
		color: black; /* Черный цвет шрифта */
        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;
				color: black; /* Черный цвет шрифта */

    }

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

    /* Стрелка выбора */
    .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: 100%;
        height: 46px;
        display: inline-block;
        vertical-align: middle;
    }

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

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

    /* Обработаем активное состояние */
    .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;
    }
	
	
	
	

    /* Завершение файла стилей */
}	

											 
					
						
							
			}	
			
			form.contacts, form.password { 
				max-width: 100% !important;
				overflow: hidden;
				width: 100% !important;
				label {
    				max-width: 100% !important;
    				display: block;
    				input {
        				display: block;
    				}
				}
				
				.phone-actions, .email-actions {
    				padding: 10px 0 0 0;
    				display: block;
				}
			}			

		// Пароль
		.password_wrapper {
			position: relative; width: 100%; 
			input { 
				 width: 100% !important; display: block;
			}
			.toggle_password {
				position: relative; right: 35px; top: 0; color: @blue; 
			}
			.generate-password {
				position: relative; top: 0px; left: 0; margin: 0;
			}		
			
			.password-actions {
				margin: -13px 0 0 0;
    			display: block;
			}	
		}	
		
}


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

.form-check { .mobile_wide;
	
	> section { background: @white; padding: 25px 0 0px 0; border: 1px solid #D8DFE3; border-right: 0; border-left: 0;  }

	.route_info { 
		max-width: 100% !important; background: #fff; border: 0; padding: 0 25px; 
		margin: 0 0; 
		table { width: 100% !important; }
		ul.row { list-style: none; margin: 0; padding: 0;
			li {
				.date { font-size: 14px; color: #949494; position: relative; display: block; margin: 0 0 -7px 0; }
				
				&.on_the_way {
					padding: 12px 0; overflow: hidden;
					i.wayline {
						height: 44px; width: 2px; background: @orange; display: block; float: left; margin: 0 20px 0 25px;
						position: relative;
						&:before {  
							display: block; width: 8px; height: 8px; border-radius: 50%; background: @orange; 
							content: ""; position: absolute; top: 0; left: 0; margin: -5px 0 0 -3px;
						}
						&:after {  
							display: block; width: 8px; height: 8px; border-radius: 50%; background: @orange; 
							content: ""; position: absolute; bottom: 0; left: 0; margin: 0 0 -5px -3px;
						}						
					}	
					.large { font-weight: bold; font-size: 16px; margin: -4px 0 0 0; color: #000; }				
				}

			}
		}
		
		ul.info { margin: 20px 0 10px 0; padding: 0;
			li {
				float: none; font-size: 13px; margin-bottom: 10px;
				&:after { display: none; }
			}
		}		
	}
	
	// Заголовок
	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; }
	}	
	
	.separator {
		background: #F2F7FA; height: 25px; border: 1px solid #D8DFE3; border-left: 0; border-right: 0; 
	}
	
	// Данные для проверки
	ul.form-data, ul.agreement { list-style: none; margin: 0; padding: 15px 25px;
		li {
			background: #fff; margin: 0 0 5px 0; padding: 0; 
			border: 0; color: #BEBEBE; line-height: 180%;
			b { font-weight: normal; color: #2A2A2A; }
			span.left { width: auto !important; padding-right: 5px; }
			&.agreement span { position: relative; right: 0; }
			&.insurance, &.agreement {
				background: #D2E1EA; color: #000; font-weight: normal !important;
				font-size: 11px; .mobile_wide; .mobile_wide; padding: 10px;
				h4 { padding-top: 0; margin-top: 0; font-size: 14px; }
				a {
					color: #000; text-decoration: underline;
				}
				span {
					float: right; display: inline-block; padding: 42px 10px;
					background: #F0F5F8; font-size: 20px; color: #979797; font-weight: normal;
					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;
								position: relative; top: 7px;
							}
						}
						input { display: none; }
						input:checked + i { 
							i { background: url(images/checkbox_grey.png) no-repeat center center #fff; }
						}
					}
					
				}		
			}	
			
		}
		
	}
	
	.total { 
		background: #fff; padding: 15px 25px; font-weight: normal; color: #BEBEBE; margin: 0 0; 
		span { color: #2A2A2A; }
	}
	
	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; }
	}
	
}

// Форма ввода пароля
.wide_content {
	.login{
		.mobile_padding;
		form { margin: 30px 0 0 0; 
			label { display: block; width: 94%; margin: 0 auto 10px auto; }
			input[name="pincode"] {
				background: none; border: none; border: 1px solid #E9EAED; background: @white; .border-radius (@radius: 3px);
				width: 100% !important; 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; border: 0; 
				height: 50px; line-height: 50px; padding: 0 0; font-size: 18px; outline: none; font-weight: 500;
				position: relative; top: 0; left: 0; width: 94%; background: #F0652F; color: @white;
				&:before { 
					content: "\f090"; font-family: FontAwesome; display: inline-block; color: @yellow; padding: 0 10px 0 0; 
					display: none;
				}
			}		
		}
	}
}

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

.payment { 
	
	> section { background: @white; padding: 25px 0; border: 1px solid #D8DFE3; border-right: 0; border-left: 0; }
	
	.route_info { 
		max-width: 100% !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.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;
	}
	
	input.pay { 
		display: block; width: 94%; border: none; background: #F0652F; padding: 10px; margin: 20px auto 0 auto; 
		text-align: center; font-size: 18px; color: @white;
		&:hover { text-decoration: none; }
	}
	
	.uniteller {
		width: 234px; margin: 25px auto;
    text-align: center; color: #929292; font-size: 11px;
	}
	
	.uniteller_text { font-size: 12px; text-align: justify; padding: 0 3%; }
	
}


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

// Сброс пароля
.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; 
			}
		}		
	}
}

// Шапка личного кабинета
.user_header { 
	> section { width: 100%; 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: 0;
	.title { color: @white; font-size: 22px; font-weight: 200; padding: 10px 0 0 18px; }
	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 {
    	h1 { padding: 0 25px !important; }
    	padding: 0;
		form { margin: 30px 0 0 0;
    		input { width: 100% !important; }
			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: 0; left: 0; color: black; 
				&:before { 
					content: "\f090"; font-family: FontAwesome; display: inline-block; color: @yellow; padding: 0 10px 0 0; margin: 0 0 0 -10px;
				}
			}		
		}
	}
	
	.password_recovery_instructions { width: 100%; font-size: 12px; br { display: none; }  }
	.reset_password {
    	padding: 0 5% !important;
    	.loginFPEmailLabel { width: 100%; }
    	input, button {
        	width: 100% !important;
    	}
	}
}


// Страница «Мои билеты»
.user.sorting { border-bottom: 2px solid #F0F5F8; display: none; }

ul.user.tickets {  
	text-align: left; position: relative; top: -3px;
	
	.wide { text-align: center; }
	
	li { cursor: default !important; border-bottom-width: 3px !important;
		&.active, &.active li { cursor: pointer !important; }
		
		.ticket_options { display: block;
			li {
				margin: 0 0 13px 0; font-size: 11px; display: block;
				> div { line-height: 100%; 
					b { display: inline; font-size: 11px; font-weight: bold; }
				}
			}
			span {
				color: #fff; padding: 6px 0; text-align: center; min-width: 132px;
				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; width: 100% !important;
				&.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; }
			}
			.refund_ticket, .refund_insurance {
				
			}			
			b { 
				font-weight: normal; color: #707070; display: block; width: 100%;
				position: relative; padding: 10px 0; text-align: center;
				font-size: 10px;
			}			
		}
		
		// Кнопка «Печать»
		.print_ticket, .print_insurance { 
			width: 100%;
		}		
	}
	ul.info { margin: 10px 0 !important }
	ul.refund_status { 
		margin: 10px 10px !important; font-size: 12px !important; 
		
	}
	
	.refund_mobile_info { 
		line-height: 140% !important; padding: 10px 0 !important; display: block !important; 
		border-color: #999 !important; width: 100% !important; float: none !important;
		border: none !important;
	}
}

// Пагинация
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; } }
	section { padding-top: 0 !important; & > p { padding: 20px 0 10px 0; } }
	
	
	// Действия
	.actions {
		text-align: center; margin: 10px 0;
		button { 
			display: inline-block; background: none; border: none; border: 2px solid #F0F5F8; 
			.border-radius (@radius: 3px); padding: 10px 15px; font-size: 12px; color: @link; outline: none;
			&:first-child { margin-right: 0; color: red; }
			&:last-child {
				text-decoration: none; border: 2px solid @darkblue; color: @black;
			}
			&:hover { text-decoration: none; }
		}
	}
	
	.change_password {
    	h3 + span { padding: 15px 0 10px 10px; display: inline-block; top: 0 !important; position: inherit; }
    	ul { padding: 0; }
    	label { padding: 0 !important; }
	}
	
}

// Страница возврата
.form-filling.refund {
    margin-top: 0;
    & > section { padding-top: 20px; }
    ul.cause {
        width: 100%; padding: 20px;
        li { 
            width: 100% !important;  
            label { padding-bottom: 0; }
            input[name=another_reason] { width: 100% !important; display: inline-block !important; margin: 10px 0 0 0 !important; }
        }
        
        & + button { float: none; margin: -10px 20px 20px 20px; }
    }
    
    ul.files {
        li {
            label {
                padding: 0 20px;
                input[type=text] { width: auto !important; }
                .fileupload { top: auto; margin: auto; }
            }
        }
    }
    
    span.link_to_doc {
        width: 100% !important; padding: 20px 20px 0 20px; margin-bottom: -20px; display: block;
    }
    
    .actions { padding: 20px 0; 
        .back { color: #465C7A; }   
        button[name=save] { color: red; border-color: red; }
    }
}

}