/* Account content uses the same centered box and side padding as the header. */

body.woocommerce-account .content-area {
	padding-top: 20px !important;
	padding-bottom: 40px !important;
}

body.woocommerce-account .content-area .container {
	width: 100%;
	max-width: 1320px;
	margin-left: auto;
	margin-right: auto;
	padding-left: calc(var(--bs-gutter-x, 1.5rem) * 0.5);
	padding-right: calc(var(--bs-gutter-x, 1.5rem) * 0.5);
}

@media (min-width: 1400px) {
	body.woocommerce-account .content-area .container {
		max-width: var(--txwsa-container-width, 1554px) !important;
	}
}

/* Every account builder (dashboard, orders, address, account details) uses the header width. */
body.woocommerce-account #rtsb-builder-content .elementor > .e-con.e-parent,
body.woocommerce-account #rtsb-builder-content .elementor-element-4c0ddcc,
body.woocommerce-account .elementor-721 > .e-con.e-parent {
	--container-max-width: 1320px !important;
	--content-width: min(1320px, 100%) !important;
	width: 100%;
	margin-left: auto !important;
	margin-right: auto !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	left: auto !important;
}

body.woocommerce-account #rtsb-builder-content .elementor > .e-con.e-parent.e-con-full,
body.woocommerce-account .elementor-element-4c0ddcc.e-con-full,
body.woocommerce-account .elementor-721 > .e-con.e-parent.e-con-full {
	max-width: min(1320px, 100%) !important;
}

body.woocommerce-account #rtsb-builder-content .elementor > .e-con.e-parent > .e-con-inner,
body.woocommerce-account .elementor-element-4c0ddcc > .e-con-inner,
body.woocommerce-account .elementor-721 > .e-con.e-parent > .e-con-inner {
	max-width: min(1320px, 100%) !important;
	width: 100%;
	margin-left: auto !important;
	margin-right: auto !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

@media (min-width: 1400px) {
	body.woocommerce-account #rtsb-builder-content .elementor > .e-con.e-parent,
	body.woocommerce-account #rtsb-builder-content .elementor-element-4c0ddcc,
	body.woocommerce-account .elementor-721 > .e-con.e-parent {
		--container-max-width: var(--txwsa-container-width, 1554px) !important;
		--content-width: var(--txwsa-container-width, 1554px) !important;
	}

	body.woocommerce-account #rtsb-builder-content .elementor > .e-con.e-parent.e-con-full,
	body.woocommerce-account .elementor-element-4c0ddcc.e-con-full,
	body.woocommerce-account .elementor-721 > .e-con.e-parent.e-con-full {
		max-width: var(--txwsa-container-width, 1554px) !important;
	}

	body.woocommerce-account #rtsb-builder-content .elementor > .e-con.e-parent > .e-con-inner,
	body.woocommerce-account .elementor-element-4c0ddcc > .e-con-inner,
	body.woocommerce-account .elementor-721 > .e-con.e-parent > .e-con-inner {
		max-width: var(--txwsa-container-width, 1554px) !important;
	}
}

body.woocommerce-account.logged-in.has-sidebar .content-area .row > .col-xl-3,
body.woocommerce-account.logged-in.has-sidebar .content-area .sidebar-widget-area {
	display: none;
}

body.woocommerce-account.logged-in .content-area .row > [class*="col-"] {
	flex: 0 0 100%;
	max-width: 100%;
	width: 100%;
}

/* Address dropdowns: strip every built-in arrow, then draw one on the field.
   The parent theme paints the SVG on the Select2 arrow with a 4-class selector, so this has to outrank it. */
body.woocommerce-account .address-field .select2-container--default .select2-selection--single,
body.woocommerce-account .address-field .select2-container--default .select2-selection--single .select2-selection__arrow,
body.woocommerce-account .woocommerce-billing-fields .select2-container--default .select2-selection--single .select2-selection__arrow,
body.woocommerce-account .woocommerce-address-fields select,
body.woocommerce-account .woocommerce-address-fields .select2-selection__arrow b {
	-webkit-appearance: none !important;
	-moz-appearance: none !important;
	appearance: none !important;
	background-image: none !important;
}

body.woocommerce-account .address-field .select2-container--default .select2-selection--single .select2-selection__arrow,
body.woocommerce-account .woocommerce-billing-fields .select2-container--default .select2-selection--single .select2-selection__arrow {
	width: 0 !important;
	min-width: 0 !important;
	overflow: hidden !important;
	background: none !important;
	border: 0 !important;
}

body.woocommerce-account .woocommerce-address-fields .select2-selection__arrow b,
body.woocommerce-account .woocommerce-address-fields .select2-selection__arrow::before,
body.woocommerce-account .woocommerce-address-fields .select2-selection__arrow::after,
body.woocommerce-account .woocommerce-address-fields .select2-selection::before,
body.woocommerce-account .woocommerce-address-fields .select2-selection::after {
	display: none !important;
	border: 0 !important;
	content: none !important;
}

body.woocommerce-account .woocommerce-address-fields select.select2-hidden-accessible {
	clip: rect(0 0 0 0) !important;
	clip-path: inset(50%) !important;
	height: 1px !important;
	width: 1px !important;
	margin: -1px !important;
	overflow: hidden !important;
	position: absolute !important;
}

body.woocommerce-account #billing_country_field .woocommerce-input-wrapper,
body.woocommerce-account #shipping_country_field .woocommerce-input-wrapper,
body.woocommerce-account #billing_state_field .woocommerce-input-wrapper,
body.woocommerce-account #shipping_state_field .woocommerce-input-wrapper {
	position: relative;
	display: block;
}

body.woocommerce-account #billing_country_field .woocommerce-input-wrapper::after,
body.woocommerce-account #shipping_country_field .woocommerce-input-wrapper::after,
body.woocommerce-account #billing_state_field .woocommerce-input-wrapper:has(select)::after,
body.woocommerce-account #shipping_state_field .woocommerce-input-wrapper:has(select)::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 14px;
	width: 12px;
	height: 12px;
	transform: translateY(-50%);
	background: url("../../../zilly/assets/img/select-arrow.svg") center / 12px 12px no-repeat;
	pointer-events: none;
	z-index: 2;
}

/* Country and State use the same border, height, and text placement as the other address inputs. */
body.woocommerce-account .woocommerce-address-fields select,
body.woocommerce-account .woocommerce-address-fields .select2-container--default .select2-selection--single {
	height: 44px !important;
	min-height: 44px !important;
	border: 1px solid var(--zilly-border-color, #d7d7d7) !important;
	border-radius: 6px !important;
	background-color: #fff !important;
	box-sizing: border-box !important;
	padding: 0 36px 0 15px !important;
	color: #161925 !important;
	font-family: var(--tx-font) !important;
	font-size: 16px !important;
	font-weight: 500 !important;
	line-height: 42px !important;
}

body.woocommerce-account .woocommerce-address-fields .select2-container--default .select2-selection--single {
	display: flex !important;
	align-items: center !important;
	line-height: 1.2 !important;
}

body.woocommerce-account .woocommerce-address-fields .select2-container--default .select2-selection--single .select2-selection__rendered {
	display: block !important;
	height: auto !important;
	line-height: 1.2 !important;
	padding: 0 !important;
	margin: 0 !important;
	color: #161925 !important;
	font-size: 16px !important;
	font-weight: 500 !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	white-space: nowrap !important;
	width: 100%;
}

/* Account menu matches the rest of the site type scale.
   Elementor prints a more specific rule, so this selector has to outrank it. */
body.woocommerce-account .woocommerce-MyAccount-navigation,
body.woocommerce-account .rtsb-myacount-page .woocommerce-MyAccount-navigation,
.woocommerce .elementor-721 .elementor-element.elementor-element-14eb19e .rtsb-myacount-page .woocommerce-MyAccount-navigation {
	font-family: var(--tx-font);
}

.woocommerce .elementor-721 .elementor-element.elementor-element-14eb19e .rtsb-myacount-page .woocommerce-MyAccount-navigation ul li a,
body.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
	font-family: var(--tx-font) !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	color: #161925 !important;
}

.woocommerce .elementor-721 .elementor-element.elementor-element-14eb19e .rtsb-myacount-page .woocommerce-MyAccount-navigation ul li a:hover,
.woocommerce .elementor-721 .elementor-element.elementor-element-14eb19e .rtsb-myacount-page .woocommerce-MyAccount-navigation ul li.is-active a,
body.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover,
body.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
	background-color: #222f63 !important;
	color: #fff !important;
}

body.woocommerce-account .recently-ordered-section,
body.woocommerce-account .recently-ordered-section .product-name,
body.woocommerce-account .recently-ordered-section .block-title,
body.woocommerce-account .woocommerce-MyAccount-navigation .recently-ordered-section {
	font-family: var(--tx-font) !important;
}

body.woocommerce-account .recently-ordered-section .product-name {
	font-size: 16px !important;
	font-weight: 600 !important;
}

body.woocommerce-account .recently-ordered-section .add-to-cart-button {
	font-size: 14px !important;
	font-weight: 600 !important;
}

/* Recently Ordered sits in the account nav markup, but its links are not menu items */
.woocommerce .elementor-721 .elementor-element.elementor-element-14eb19e .rtsb-myacount-page .woocommerce-MyAccount-navigation ul li.recently_ordered_main a,
.woocommerce .elementor-721 .elementor-element.elementor-element-14eb19e .rtsb-myacount-page .woocommerce-MyAccount-navigation ul li.recently_ordered_main a:hover,
body.woocommerce-account .woocommerce-MyAccount-navigation ul li.recently_ordered_main a,
body.woocommerce-account .woocommerce-MyAccount-navigation ul li.recently_ordered_main a:hover {
	background: transparent !important;
	background-color: transparent !important;
	color: #161925 !important;
	padding: 0 !important;
	border-radius: 0 !important;
}

.woocommerce .elementor-721 .elementor-element.elementor-element-14eb19e .rtsb-myacount-page .woocommerce-MyAccount-navigation ul li.recently_ordered_main a.view-all-link,
body.woocommerce-account .woocommerce-MyAccount-navigation ul li.recently_ordered_main a.view-all-link,
body.woocommerce-account .recently-ordered-section .view-all-link {
	display: inline-flex !important;
	float: none !important;
	clear: none;
	width: auto !important;
	margin: 0 0 0 auto !important;
	color: #222f63 !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	text-align: right !important;
	white-space: nowrap;
}

/* Orders list actions use the same red button and navy hover as the rest of the site. */
body.woocommerce-account .elementor-725 .elementor-element.elementor-element-39daa33 .button,
body.woocommerce-account .elementor-725 .elementor-element.elementor-element-39daa33 .rtsb-myacount-page .woocommerce-table tbody td a.button,
body.woocommerce-account .elementor-725 .elementor-element.elementor-element-39daa33 .rtsb-myacount-page .woocommerce-orders-table tbody td a.button,
body.woocommerce-account .elementor-725 .elementor-element.elementor-element-39daa33 .rtsb-myacount-page .woocommerce-pagination a.button,
body.woocommerce-account .rtsb-account-table.layout-2 .button {
	background-color: #c02334 !important;
	border-color: #c02334 !important;
	color: #fff !important;
}

body.woocommerce-account .elementor-725 .elementor-element.elementor-element-39daa33 .button:hover,
body.woocommerce-account .elementor-725 .elementor-element.elementor-element-39daa33 .rtsb-myacount-page .woocommerce-table tbody td a.button:hover,
body.woocommerce-account .elementor-725 .elementor-element.elementor-element-39daa33 .rtsb-myacount-page .woocommerce-orders-table tbody td a.button:hover,
body.woocommerce-account .elementor-725 .elementor-element.elementor-element-39daa33 .rtsb-myacount-page .woocommerce-pagination a.button:hover,
body.woocommerce-account .rtsb-account-table.layout-2 .button:hover {
	background-color: #222f63 !important;
	border-color: #222f63 !important;
	color: #fff !important;
}

/* Invoice is the second action. Without a mask, its white layer fills the whole button. */
body.woocommerce-account .rtsb-account-table.layout-2 .button.invoice:before,
body.woocommerce-account .rtsb-account-table.layout-2 .button.rtsb_invoice:before {
	background-color: #fff !important;
	-webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yLjIgMGg1LjFMMTIgNC42VjEyLjJBMS44IDEuOCAwIDAgMSAxMC4yIDE0SDIuMkExLjggMS44IDAgMCAxIC40IDEyLjJWMS44QTEuOCAxLjggMCAwIDEgMi4yIDBabTQuNiAxLjJWNC4yYzAgLjQuMy44LjguOGgzLjF2Ny4yYS42LjYgMCAwIDEtLjYuNkgyLjJhLjYuNiAwIDAgMS0uNi0uNlYxLjhhLjYuNiAwIDAgMSAuNi0uNmg0LjZaTTggMS43IDEwLjQgNEg4VjEuN1pNMy4yIDcuMmg1LjZ2MS4xSDMuMlY3LjJabTAgMi4yaDQuMnYxLjFIMy4yVjkuNFoiIGZpbGw9IiMwMDRCRkYiLz48L3N2Zz4=");
	mask-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iMTQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yLjIgMGg1LjFMMTIgNC42VjEyLjJBMS44IDEuOCAwIDAgMSAxMC4yIDE0SDIuMkExLjggMS44IDAgMCAxIC40IDEyLjJWMS44QTEuOCAxLjggMCAwIDEgMi4yIDBabTQuNiAxLjJWNC4yYzAgLjQuMy44LjguOGgzLjF2Ny4yYS42LjYgMCAwIDEtLjYuNkgyLjJhLjYuNiAwIDAgMS0uNi0uNlYxLjhhLjYuNiAwIDAgMSAuNi0uNmg0LjZaTTggMS43IDEwLjQgNEg4VjEuN1pNMy4yIDcuMmg1LjZ2MS4xSDMuMlY3LjJabTAgMi4yaDQuMnYxLjFIMy4yVjkuNFoiIGZpbGw9IiMwMDRCRkYiLz48L3N2Zz4=");
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: 62%;
	mask-size: 62%;
}