/* ------------------------------------------
  MY ACCOUNT
--------------------------------------------- */
:root {
	--color-warm-black: #000c00;     /* Warm black */
	--color-dark-grey: #343333;      /* Dark grey */
	--color-mid-grey: #5f6062;       /* Grey type */
	--color-borders: #d4d4d4;        /* Borders */
	--color-light-grey: #f2f2f2;     /* Light grey tint */
}

#myaccount								{ margin-top:20px;
	.item-section						{ background-color:#f2f2f2; border:0 none; border-radius:15px;
		a								{ text-decoration:none; padding:15px; }
		h2								{ text-align:left; }
		.icon							{ float:left; width:55px; height:55px; border-radius:50%; background-color:#343333;
			img							{ width:100%; height:100%; }
		}
		.info							{ margin-left:70px; }
	}
	.account-separator					{ margin-top:20px; padding-top:20px; }
	.myaccount-content .favourites-wrapper
										{ display:none; }
	.path a								{ background-repeat:no-repeat; background-position:1px center; background-image:url(/media/icons/previous.svg); padding-left:22px; }
	.item-wrapper						{ display:grid; grid-template-columns:repeat(3, 1fr); grid-gap:20px; }
	.item-section						{ display:inline-grid; border:1px solid #bbb; border-radius:5px;
		a								{ color:inherit; font-weight:inherit; padding:10px; }
		img								{ float:left; width:40px; height:40px; }
		h2								{ margin-bottom:0; }
		.item:hover						{ background-color:#efefef; }
		.info							{ margin-left:50px;
			.description				{ line-height:1.2em; min-height:2.5em; }
		}
	}
	#path, .path						{ text-transform:capitalize; line-height:30px; margin-bottom:20px;
		&:before						{ width:30px; height:30px; content:""; display:inline-block; background-color:#D6D7D9; border-radius:50%; vertical-align:top; }
		a								{ background-size:20px; background-position:left center; padding-left:34px; margin-left:-30px; display:initial; }
	}
	h2.account							{ text-align:left; }
	a:hover								{ color:#343333; }
	.paginator							{ font-size:14px;
		a								{ text-decoration:none; }
		b								{ text-decoration:none; font-size:14px; }
	}
	.order-block						{ background:#f2f2f2; border-radius:15px; margin-bottom:20px; line-height:1.6; border:0px;
		&:last-child					{ margin-bottom:0; }
		.order-header					{ background-color:#d4d4d4; border-radius:15px 15px 0 0; padding:15px;
			th							{ padding-right:30px; vertical-align:top; font-weight:400; font-size:12px; text-transform:uppercase; letter-spacing:0.04em; padding-bottom:0.30px;
				&:last-child			{ padding-right:0; }
			}
			td							{ padding-right:30px; vertical-align:top; font-weight:700; font-size:17px;
				&:last-child			{ padding-right:0; }
				.order-details a, .invoice-details a
										{ background-color:var(--color-dark-grey); text-decoration: none; font-size: 14px; font-weight: 400; color: #fff; padding: 0 15px; margin: 3px 0; line-height: 28px; height: 28px; border-radius: 14px; display: inline-block; }
			}
			.responsive-table			{ text-align:left; border-collapse:collapse; }
		}
		.order-body						{
			#order-items				{ padding:15px; }
			.order-item					{ background:#fff; border-radius:10px; margin:0 0 15px 0;
				img						{ max-width:100%; }
				.columns.medium-4.large-4 div:nth-child(2n)
										{ margin-bottom:7px; } /* PRICE */
				.columns:nth-child(3n)	{ font-size:15px; text-align:center; } /* STATUS */
				.detail					{ font-size:14px; font-style:normal;
					&:empty				{ display:none; }
				}
				&:before				{ height:10px; }
				&:last-child			{ margin-bottom:0; }
				&:after					{ margin-bottom:0; }
				a						{ text-decoration:none; font-weight:700; }
				img						{ width:300px; margin:0 auto; display:block; }
			}
			.product-action-form		{ text-align:center; }
			.button						{ text-decoration: none; font-size: 14px; font-weight: 400; color: #fff; padding: 0 15px; margin: 3px 0; line-height: 28px; height: 28px; border-radius: 14px; display: inline-block; }
			&.button-order-again		{ background-color:var(--color-mid-grey); }
			&.button-add-to-favourites	{ background-color:var(--color-mid-grey); }
		}
	}
}

@media (max-width:1020px)	{
	#myaccount .item-wrapper			{ grid-template-columns:repeat(2, 1fr); }
}

@media screen and (max-width: 767px) 	{
	#myaccount								{
		.paginator							{ text-align:center; }
		.order-block						{
			.order-header					{
				.order-title				{ display:none; }
				table.responsive-table, table.responsive-table *
											{ background-color:transparent; }
				.responsive-table tr		{ border:0 none; margin:0;
					td						{ padding-left:0; border-bottom:0 none;
						&:before			{ font-weight:400; font-size:14px; position:initial; padding-right:5px; }
					}
				}
			}
			.order-body						{
				.order-item					{ text-align:center;
					img						{ margin-top:5px; margin-bottom:15px; }
				}
				.product-action				{ margin-top:10px;
					.fw-mobile				{ width:auto !important; }
				}
			}
		}
	}
}

@media (max-width:700px)	{
	#myaccount .item-wrapper			{ grid-template-columns:repeat(1, 1fr); }
}

/*---------------- user ----------------*/
.user									{
	.more-info							{ margin-top:20px; padding-top:20px; }
	.secure-msg							{ margin:20px 0; padding-left:20px; background:url(/media/icons/lock.svg) no-repeat; }
	.secure-msg::before					{ content:'This page is secure and your personal details are protected.'; }
	.forgot-password					{ margin-top:20px; }
}
.user-dialog 							{
	.dialog-title						{ color:#444; font-size:1.7em; font-weight:300; margin-bottom:0.8em;
		a								{ color:#444; }
	}
	.dialog-buttons						{ position:absolute; bottom:0; right:0; }
}

/*---------------- user pane ----------------*/
#user-pane								{ position:relative; float:right;
	ul									{ margin:0; }
	li									{ list-style:none; line-height:25px; float:left; color:#444; margin:0 3px; }
	.account-favourites-link::after		{ content:"Favourites"; }
}
