/**
 * Styles for the order receipt/thank you page
 *
 * body_class: order-receipt bg-light
 *
 * @author      Jim Mock
 * @copyright   2021, ON1
 */

/*------------------------------------------------------------------------------
 * Hero
 -----------------------------------------------------------------------------*/
body.order-receipt #hero .container-fluid {
	padding-left: 30px;
	padding-right: 30px;
}

body.order-receipt #hero .order-receipt-hero {
	background: #1e1e1e url(https://ononesoft.cachefly.net/wp-content/themes/on1/images/account/hero-order-receipt-1920.jpg) center center no-repeat;
	background-size: cover;
	border-radius: 10px;
	margin-left: 0;
	margin-right: 0;
}

@media screen and (max-width: 1280px) {
	body.order-receipt #hero .order-receipt-hero {
		background: #1e1e1e url(https://ononesoft.cachefly.net/wp-content/themes/on1/images/account/hero-order-receipt-1280.jpg) center center no-repeat;
		background-size: cover;
	}
}

body.order-receipt #hero .list-inline li {
	border-right: 2px solid #303030;
	line-height: 1.6;
}

body.order-receipt #hero .list-inline li:last-child { border-right: none; }

body.order-receipt #hero .list-inline li span {
	font-size: 0.75rem;
	font-weight: 900;
	text-transform: uppercase;
}

/*------------------------------------------------------------------------------
 * Content
 -----------------------------------------------------------------------------*/
body.order-receipt #site-main #account-orders p { margin-bottom: 1.875rem; }
body.order-receipt #site-main #account-orders p:last-child { margin-bottom: 0; }

body.order-receipt #site-main #account-orders .account-email {
	font-size: 1.25rem;
	margin-left: 1.5rem;
}

body.order-receipt #site-main #account-orders form label {
	color: #7c7c7d;
	display: block;
	font-size: 0.875rem;
	margin-bottom: 0;
}

body.order-receipt #site-main #account-orders form .form-group { margin-bottom: 1.5rem; }

body.order-receipt #site-main #account-orders form .form-control {
	border: 1px solid #eaeaea;
	border-left: none;
	border-radius: 0;
	border-right: none;
	border-top: none;
	color: #303030;
}

body.order-receipt #site-main #account-orders form .form-control:focus { border-color: #0a7efa; }

body.order-receipt #site-main #account-orders form .form-control.is-valid, body.order-receipt #site-main #account-orders form.was-validated .form-control:valid {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%2321ce6e' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
	background-position: center right calc(.375em + .1875rem);
	background-repeat: no-repeat;
	background-size: calc(.75em + .375rem) calc(.75em + .375rem);
	border-color: #21ce6e;
}

body.order-receipt #site-main #account-orders form .form-control.is-invalid, body.order-receipt #site-main #account-orders form.was-validated .form-control:invalid {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23ff3d57' viewBox='-2 -2 7 7'%3e%3cpath stroke='%23ff3d57' d='M0 0l3 3m0-3L0 3'/%3e%3ccircle r='.5'/%3e%3ccircle cx='3' r='.5'/%3e%3ccircle cy='3' r='.5'/%3e%3ccircle cx='3' cy='3' r='.5'/%3e%3c/svg%3E");
	background-position: center right calc(.375em + .1875rem);
	background-repeat: no-repeat;
	background-size: calc(.75em + .375rem) calc(.75em + .375rem);
	border-color: #ff3d57;
}

body.order-receipt #site-main #account-orders form .form-control.is-valid:focus, body.order-receipt #site-main #account-orders form.was-validated .form-control:valid:focus, body.order-receipt #site-main #account-orders form .form-control.is-invalid:focus, body.order-receipt #site-main #account-orders form.was-validated .form-control:invalid:focus { box-shadow: none; }

body.order-receipt #site-main table.table {
	color: #303030;
	width: 100%;
}

body.order-receipt #site-main table.table-bordered { border: 1px solid #eaeaea; }
body.order-receipt #site-main table.table-striped tbody tr:nth-of-type(odd) { background-color: #f6f6f7; }
body.order-receipt #site-main table.table th { border: 1px solid #eaeaea; }

body.order-receipt #site-main table.table td {
	border: 1px solid #eaeaea;
	vertical-align: top;
}

body.order-receipt #site-main table.table th, body.order-receipt #site-main table.table.table-bordered th, body.order-receipt #site-main table.table.table td, body.order-receipt #site-main table.table.table-bordered td { border-bottom: 1px solid #eaeaea; }

body.order-receipt #site-main table.table td h4 {
	color: #676767;
	font-size: 0.875rem;
	font-weight: 500;
	margin-bottom: 0.25rem;
	margin-left: 1rem;
	margin-top: 0.625rem;
}

body.order-receipt #site-main table.table td ul {
	margin-bottom: 0;
	margin-left: 0.313rem;
}

body.order-receipt #site-main table.table td li {
	font-size: 0.875rem;
	margin-bottom: 0.5rem;
}

body.order-receipt #site-main table.table td li:last-child { margin-bottom: 0; }

body.order-receipt #site-main table td img {
	height: 36px;
	width: 36px;
}

body.order-receipt #site-main table td.product-name { width: 100%; }

body.order-receipt #site-main table td.view-details {
	font-size: 0.875rem;
	white-space: nowrap;
}
