/*******************************************************************************
********************************************************************************
PAGE: ACCOUNT
********************************************************************************
*******************************************************************************/
.cerade__account
{

}

/*******************************************************************************
SECTIONS
*******************************************************************************/
/* Make section white because they are gray from Elementor */
.cerade__account .elementor-widget-woocommerce-my-account .e-my-account-tab__orders .woocommerce-MyAccount-content-wrapper,
.cerade__account .woocommerce-MyAccount-content-wrapper
{
	padding: 20px !important;
	border-radius: 10px !important;
	background-color: var(--cerade-color-white) !important;
}

/*******************************************************************************
TITLES
*******************************************************************************/
.cerade__account h2
{
	margin-top: 20px !important;
	margin-bottom: 20px !important;
}
/*******************************************************************************
FORMS
*******************************************************************************/
/* Move labels a bit to the right to make them look uniform */
/* Change weight of the labels to make them uniform accross site */
.cerade__account label
{
	padding-left: 15px !important;
	font-weight: 500 !important;
}

/*******************************************************************************
ORDERS
*******************************************************************************/
@media screen and (max-width: 767px)
{
	/* Add spacing between orders */
	.cerade__account .woocommerce-orders-table .woocommerce-orders-table__row
	{
		margin-bottom: 20px;
	}

	/* Add order number on mobile */
	.cerade__account .woocommerce-orders-table th.woocommerce-orders-table__cell-order-number
	{
		display: block !important;
		text-align: right !important;
	}
	.cerade__account .woocommerce-orders-table th.woocommerce-orders-table__cell-order-number::before
	{
		float: left !important;
		content: attr(data-title) ": " !important;
		font-family: 'Roboto', sans-serif !important;
		font-size: 16px !important;
		font-weight: 700 !important;
		line-height: 1.5rem !important;
	}
}

/*******************************************************************************
ORDER DETAILS
*******************************************************************************/
/* Align variation data left */
.cerade__account .woocommerce-table--order-details .wc-item-meta
{
	padding-left: 0px !important;
}

/* Add space before phone to divide adress form phone and e-mail */
.cerade__account .woocommerce-customer-details--phone
{
	margin-top: 20px !important;
	margin-bottom: 0px !important;
}

/*******************************************************************************
ADRESSES
*******************************************************************************/
/* Remove backoground box */
.cerade__account .woocommerce-address-fields
{
	padding: 0px !important;
	background: var(--cerade-color-white) !important;
}

/* Align country field and make it look like everything else */
.cerade__account .woocommerce-address-fields #billing_country_field span strong,
.cerade__account .woocommerce-address-fields #shipping_country_field span strong
{
	margin-left: 15px !important;
	font-family: 'Roboto', sans-serif !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	color: #999999 !important;
	line-height: 24px !important;
}

/*******************************************************************************
ACCOUNT
*******************************************************************************/
/* Move descriptions a bit to the right to make them aligned with labels */
.cerade__account .edit-account #account_display_name_description
{
	display: block !important;
	margin-left: 15px !important;
}

/* Hide change password title */
.cerade__account .edit-account legend
{
	display: none !important;
}
