@import "variables";

.section-profile {
	.section-profile-row {
		position: relative;
		@media (min-width: 1200px){ margin-left: -12px; }
		.section-profile-side {
			float: left;
			width: 216px;
		}
		.section-profile-content {
			position: relative;
			padding-left: 24px;
			//margin-left: 230px;
			@media(min-width: 1200px){
				overflow: hidden;
				.panel-white {
					margin-right: 8px;
				}
			}
		}
		@media(max-width: 1199px){
			.section-profile-side {
				float: none;
				width: auto;
			}
			.section-profile-content {
				margin-left: 0;
				padding-left: 0;
			}
		}
		&._column {
			.section-profile-side {
				float: none;
				padding-bottom: 24px;
			}
			.section-profile-content {
				padding-left: 0;
			}
		}
	}
}

.section-profile-content {
	.spc-list-orders {
		position: relative;
		margin-left: -12px;
		margin-right: -12px;
		.order {
			font-size: 14px;
			&:not(:first-child){
				margin-top: 24px;
			}
			.order-line {
				position: relative;
				overflow: hidden;
				padding: 4px 12px;
				.order-line__left {
					float: left;
				}
				.order-line__right {
					text-align: right;
					a {
						border: none;
						color: inherit;
						text-decoration: none;
						&:hover {
							color: $blue;
						}
					}
				}
			}
			.order-head {
				background: $color_gray_05;
				border-bottom: 1px solid lighten($color_gray_20, 7%);
			}
			.order-body {
				.order-line {
					border-bottom: 1px dashed $color_gray_10;
				}
			}
			.order-footer {
				padding: 4px 0;
				a {
					display: inline-block;
					vertical-align: middle;
					&.btn {
						padding: 3px 12px 6px;
						font-size: 13px;
					}
				}
			}
		}
	}
}

.profile-list-order {
	padding-right: 8px;
	.plo-item {
		background: $color_white;
		border: 1px solid rgba(0,0,0,0.05);
		margin: 12px 0;
		font-size: 14px;
		@include border-radius(4px);
		@include box-shadow(0 2px 7px rgba(0,0,0,0.15));
		/*& + .plo-item {
			margin-top: 12px;
		}*/
		&:first-child {
			margin-top: 0 !important;
		}
		&:last-child {
			margin-bottom: 0 !important;
		}
		.plo-item__head {
			position: relative;
			padding: 12px 16px 12px 40px;
			.plo-item__status {
				background: $color_gray_30;
				position: absolute; top: 17px; left: 16px;
				display: block;
				width: 12px;
				height: 12px;
				@include border-radius(50%);
				&.success { background: $green; }
				&.danger { background: $red; }
				&.warning { background: $yellow; }
			}
			.plo-item__name {
				@media (min-width: 576px){
					float: left;
				}
				font-weight: bold;
				//white-space: nowrap;
				.ico {
					position: relative;
					display: inline;
					margin-left: 4px;
					font-family: 'FontAwesome';
					font-size: inherit;
					font-weight: normal;
					font-style: normal;
					&:before {
						content: "\f107";
					}
				}
				.fa {
					position: relative;
					display: inline;
					margin-left: 4px;
					//font-size: 18px;
				}
			}
			.plo-item__amount {
				@media (min-width: 576px){
					float: right;
				}
				.amount-mark {
					@media (min-width: 576px) {
						display: none;
					}
				}
			}
			&:hover {
				cursor: pointer;
			}
		}
		.plo-item__body {
			position: relative;
			padding: 12px 16px;
			line-height: 1.25;
			display: none;
			&:before {
				content: '';
				background: $color_gray_10;
				position: absolute; top: 0; right: 16px; left: 16px;
				display: block;
				height: 1px;
			}
			.plo-item__goods {
				td {
					padding-right: 12px;
					vertical-align: top;
				}
			}
			.plo-item__dates {
				text-align: right;
				td {
					padding-left: 8px;
					&:first-child {
						color: $color_gray_40;
					}
				}
			}
			.plo-item__buttons {
				position: relative;
				display: flex;
				flex-wrap: wrap;
				justify-content: flex-end;
				margin: 0 -4px;
				padding: 0;
				list-style: none;
				text-align: right;
				@media (max-width: 575px){
					margin-left: -2px;
					margin-right: -2px;
				}
				li {
					padding-top: 8px;
					padding-left: 4px;
					padding-right: 4px;
					@media (max-width: 575px){
						padding-left: 2px;
						padding-right: 2px;
					}
				}
				.btn {
					padding: 5px 10px 6px;
					font-size: 14px;
					@media (max-width: 575px){
						padding: 3px 6px 4px;
						.without-icon-xxs {
							padding-left: 0;
							.ico {
								display: none;
							}
						}
					}
				}
			}
		}

		//mod
		&.open {
			//margin: 24px 0;
			margin-bottom: 24px;
			.plo-item__head {
				.plo-item__name {
					.ico {
						&:before {
							content: "\f106";
						}
						//@include transform(rotate(180deg));
					}
				}
				.plo-item__amount {
					.amount-mark {
						display: inline-block;
						font-size: 14px !important;
					}
				}
			}
			.plo-item__body {
				display: block;
			}
		}
	}
}

.res-list-group {
	position: relative;
	.res-list-group__head {
		position: relative;
		display: none;
		.btn {
			/*background: $color_gray_05;
			border: 1px solid $color_gray_10;
			display: block;
			width: 100%;*/
			padding: 10px 12px;
			/*color: $color_dark !important;*/
			text-align: left;
		}
		.fa {
			position: absolute; top: 50%; right: 10px;
			@include transform(translateY(-50%));
		}
	}
	.res-list-group__body {
		& > ul {
			background: $color_white;
			border: 1px solid $color_gray_10;
			margin: 0;
			padding: 0;
			list-style: none;
			@include border-radius(3px);
			& > li {
				& + li {
					border-top: 1px solid $color_gray_10;
				}
				ul.submenu {
					display: none;
					margin: 0; padding: 0; list-style: none;
					li {
						border-top: 1px solid $color_gray_10;
					}
				}
				&:first-child {
					& > .res-list-group__item, & > a.res-list-group__item {
						@include border-radius(3px 3px 0 0);
					}
				}
				&:last-child {
					& > .res-list-group__item, & > a.res-list-group__item {
						@include border-radius(0 0 3px 3px);
					}
				}
				&.open {
					ul.submenu { display: block; }
				}
			}
			.res-list-group__item {
				padding: 10px 12px;
			}
			a.res-list-group__item {
				border: none;
				display: block;
				color: $color_dark;
				&:hover {
					background: $color_gray_03;
				}
			}
			.current {
				& > .res-list-group__item, & > a.res-list-group__item {
					background: $color_blue;
					color: $color_white;
				}
				//ul.submenu { display: block; }
			}
		}
	}
	@media (max-width: 1199px) {
		margin-bottom: 30px;
		.res-list-group__head {
			display: block;
		}
		.res-list-group__body {
			position: absolute; top: 100%; left: 0; right: 0;
			z-index: 777;
			display: none;
			padding-top: 2px;
			ul {}
		}
		&.open {
			.res-list-group__body {
				display: block;
			}
		}
	}
}

.profile-udata {
	position: relative;
	display: inline-block;
	.profile-udata-dl {
		margin: 0; padding: 0;
		dt {
			margin: 0; padding: 0;
			font-size: 16px;
			font-weight: bold;
			color: $color_blue;
			a {
				border-bottom-color: transparent;
				&:hover { border-bottom-color: $color_blue; }
			}
		}
		dd {
			margin: 0;
			padding: 4px 0 0 0;
			font-size: 12px;
			color: $color_gray_50;
			a {
				border: none;
				color: $color_gray_50;
				&:hover {
					color: $color_blue;
				}
			}
		}
	}
	&:hover {
		dt {
			a {
				border-bottom-color: $color_blue;
			}
		}
		dd {
			color: $color_blue;
		}
	}
}

.s-p-history {
	max-width: 750px;
	.s-p-history__table {
		min-width: 600px;
	}
}

.profile-site-settings {
	.pss-options {
		margin: 0; padding: 0; list-style: none;
		.pss-options__item {
			position: relative;
			//@media (min-width: 992px){ margin-left: -8px; }
			//margin-bottom: 4px;
			//padding: 4px 8px 8px;
			//& + .pss-options__item { margin-top: 4px; }

			& + .pss-options__item {
				/*border-top: 2px solid $color_gray_10;
				margin-top: 12px;
				padding-top: 12px;*/
				margin-top: 20px;
			}

			.pss-option__head {
				.form-check {
					font-size: 15px;
					.label {
						display: none;
						padding: 0 8px 2px;
						font-size: 15px;
						font-weight: normal;
						line-height: 1.5;
						@include transition();
						&.label-success {
							background: #2db92d;
							color: $color_white;
						}
					}
					label { font-weight: bold;}
					a { font-weight: normal; white-space: nowrap; }
					&.active {
						.label { display: inline-block; }
						.arr {
							background: #bff4ae;
						}
					}
				}
			}
			.pss-option__body {
				display: none;
				padding: 0 0 0 21px;
				.checked-show {
					display: block;
				}
				.checked-hide {
					display: none;
				}

			}

			.pss-options__show {}
			.pss-options__hide { display: none; }

			&.pss-options__subitem {
				margin-left: 21px;
				//display: none;
			}

			&.active:not(.pss-options__subitem) {
				//margin-bottom: 32px;
			}
			&.active {
				//@include box-shadow(inset 0 0 8px 0 #7e93b2);
				& > .pss-option__body {
					display: block;
				}
				.pss-options__show { display: none; }
				.pss-options__hide { display: block; }
				span.pss-options__hide, a.pss-options__hide { display: inline-block; }
			}
			&.checked {
				.pss-option__body {
					.checked-show { display: none; }
					.checked-hide { display: block; }

					.panel {
						&.panel-tab {
							.panel-heading {
								background-color: #bff4ae;
							}
							.panel-body {
								border-color: #bff4ae;

								.mCustomScrollbar .mCustomScrollBox .mCSB_scrollTools .mCSB_draggerContainer .mCSB_dragger .mCSB_dragger_bar {
									background-color: $color_toxic !important;
								}
							}
						}
					}
				}
			}
		}
	}
}