/*
 * Shopro WooCommerce account compatibility layer.
 * Loaded only on My Account pages after Machic and WooCommerce styles.
 */

body.woocommerce-account.shopro-account-ui .my-account-page,
body.woocommerce-account.shopro-account-ui .my-account-page > .container,
body.woocommerce-account.shopro-account-ui .my-account-page .woocommerce,
body.woocommerce-account.shopro-account-ui .shopro-account-shell,
body.woocommerce-account.shopro-account-ui .shopro-login-shell {
	box-sizing: border-box;
	min-width: 0;
}

body.woocommerce-account.shopro-account-ui .my-account-page > .container,
body.woocommerce-account.shopro-account-ui .my-account-page .woocommerce {
	width: 100%;
}

body.woocommerce-account.shopro-account-ui .shopro-account-shell,
body.woocommerce-account.shopro-account-ui .shopro-login-shell {
	width: min(100%, 1320px);
	max-width: 1320px;
	margin-inline: auto;
	padding-inline: 10px;
}

/* Stable account grid. WooCommerce's 30%/68% floats and Machic flex rules cannot compress it. */
body.woocommerce-account.shopro-account-ui .shopro-account-layout {
	display: grid !important;
	grid-template-columns: minmax(260px, 290px) minmax(0, 1fr) !important;
	gap: 30px !important;
	align-items: start !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

body.woocommerce-account.shopro-account-ui .shopro-account-layout > .shopro-account-navigation-wrap,
body.woocommerce-account.shopro-account-ui .shopro-account-layout > .woocommerce-MyAccount-content,
body.woocommerce-account.shopro-account-ui .shopro-account-layout > .shopro-account-content,
body.woocommerce-account.shopro-account-ui .shopro-account-nav,
body.woocommerce-account.shopro-account-ui .woocommerce-MyAccount-navigation {
	float: none !important;
	clear: none !important;
	flex: none !important;
	width: 100% !important;
	min-width: 0 !important;
	max-width: none !important;
	margin-inline: 0 !important;
}

body.woocommerce-account.shopro-account-ui .shopro-account-navigation-wrap {
	box-sizing: border-box;
}

body.woocommerce-account.shopro-account-ui .woocommerce-MyAccount-content,
body.woocommerce-account.shopro-account-ui .shopro-account-content {
	overflow: visible !important;
	padding: 32px !important;
	font-size: 15px;
	line-height: 1.65;
}

body.woocommerce-account.shopro-account-ui .woocommerce-MyAccount-content p,
body.woocommerce-account.shopro-account-ui .woocommerce-MyAccount-content li,
body.woocommerce-account.shopro-account-ui .woocommerce-MyAccount-content label,
body.woocommerce-account.shopro-account-ui .woocommerce-MyAccount-content address {
	font-size: 15px;
}

/* Undo Machic's small uppercase account headings on native WooCommerce endpoint content. */
body.woocommerce-account.shopro-account-ui .woocommerce-MyAccount-content > h2,
body.woocommerce-account.shopro-account-ui .woocommerce-MyAccount-content > h3,
body.woocommerce-account.shopro-account-ui .woocommerce-MyAccount-content > form > h2,
body.woocommerce-account.shopro-account-ui .woocommerce-order-details > h2,
body.woocommerce-account.shopro-account-ui .woocommerce-customer-details > h2,
body.woocommerce-account.shopro-account-ui .woocommerce-Address-title > h3 {
	margin: 0 0 20px !important;
	padding: 0 0 13px !important;
	border-bottom: 1px solid var(--shopro-account-border) !important;
	font-size: clamp(21px, 2.2vw, 28px) !important;
	font-weight: 800 !important;
	line-height: 1.25 !important;
	letter-spacing: -0.02em !important;
	text-transform: none !important;
}

/* Comfortable dashboard density. */
body.woocommerce-account.shopro-account-ui .shopro-dashboard {
	gap: 28px;
}

body.woocommerce-account.shopro-account-ui .shopro-stat-grid,
body.woocommerce-account.shopro-account-ui .shopro-order-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}

body.woocommerce-account.shopro-account-ui .shopro-product-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}

body.woocommerce-account.shopro-account-ui .shopro-shortcut-grid {
	gap: 16px;
}

body.woocommerce-account.shopro-account-ui .shopro-panel {
	gap: 19px;
	padding: 24px;
}

body.woocommerce-account.shopro-account-ui .shopro-stat-card {
	min-height: 142px;
	padding: 20px;
}

body.woocommerce-account.shopro-account-ui .shopro-stat-card__copy small,
body.woocommerce-account.shopro-account-ui .shopro-order-card__top small,
body.woocommerce-account.shopro-account-ui .shopro-order-card__details small {
	font-size: 11px;
}

body.woocommerce-account.shopro-account-ui .shopro-stat-card__copy span,
body.woocommerce-account.shopro-account-ui .shopro-order-card__stage,
body.woocommerce-account.shopro-account-ui .shopro-order-stage,
body.woocommerce-account.shopro-account-ui .shopro-order-updated {
	font-size: 12px;
}

body.woocommerce-account.shopro-account-ui .shopro-shortcut__copy strong {
	font-size: 15px;
}

body.woocommerce-account.shopro-account-ui .shopro-shortcut__copy small {
	font-size: 13px;
}

body.woocommerce-account.shopro-account-ui .shopro-tracking-step__copy strong {
	font-size: 13px;
}

body.woocommerce-account.shopro-account-ui .shopro-tracking-step__copy small {
	font-size: 11px;
}

/* Login and registration retain WooCommerce's expected classes but use a controlled Shopro grid. */
body.woocommerce-account.shopro-account-ui #customer_login.shopro-login-grid {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	align-items: stretch !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

body.woocommerce-account.shopro-account-ui #customer_login.shopro-login-grid::before,
body.woocommerce-account.shopro-account-ui #customer_login.shopro-login-grid::after {
	display: none !important;
	content: none !important;
}

body.woocommerce-account.shopro-account-ui #customer_login.shopro-login-grid.shopro-login-grid--single {
	grid-template-columns: minmax(0, 620px) !important;
	justify-content: center;
}

body.woocommerce-account.shopro-account-ui #customer_login > .shopro-auth-card,
body.woocommerce-account.shopro-account-ui #customer_login > .u-column1,
body.woocommerce-account.shopro-account-ui #customer_login > .u-column2,
body.woocommerce-account.shopro-account-ui #customer_login > .col-1,
body.woocommerce-account.shopro-account-ui #customer_login > .col-2 {
	float: none !important;
	clear: none !important;
	width: 100% !important;
	min-width: 0 !important;
	max-width: none !important;
	min-height: 100%;
	margin: 0 !important;
	padding: 28px !important;
	box-sizing: border-box;
}

body.woocommerce-account.shopro-account-ui .shopro-auth-card form,
body.woocommerce-account.shopro-account-ui .shopro-auth-card .form-row,
body.woocommerce-account.shopro-account-ui .shopro-auth-card input,
body.woocommerce-account.shopro-account-ui .shopro-auth-card select,
body.woocommerce-account.shopro-account-ui .shopro-auth-card textarea {
	min-width: 0;
	max-width: 100%;
}

body.woocommerce-account.shopro-account-ui .shopro-auth-card__heading > div > span,
body.woocommerce-account.shopro-account-ui .shopro-section-kicker,
body.woocommerce-account.shopro-account-ui .shopro-orders-intro__copy > span {
	font-size: 11px;
}

body.woocommerce-account.shopro-account-ui .shopro-auth-card__options label,
body.woocommerce-account.shopro-account-ui .shopro-auth-card__options a,
body.woocommerce-account.shopro-account-ui .shopro-login-intro__links a,
body.woocommerce-account.shopro-account-ui .shopro-auth-card__helper,
body.woocommerce-account.shopro-account-ui .woocommerce-password-strength {
	font-size: 13px !important;
}

body.woocommerce-account.shopro-account-ui .form-row label,
body.woocommerce-account.shopro-account-ui .woocommerce-form__label {
	font-size: 14px;
	line-height: 1.45;
}

body.woocommerce-account.shopro-account-ui .my-account-page input[type="text"],
body.woocommerce-account.shopro-account-ui .my-account-page input[type="email"],
body.woocommerce-account.shopro-account-ui .my-account-page input[type="password"],
body.woocommerce-account.shopro-account-ui .my-account-page input[type="tel"],
body.woocommerce-account.shopro-account-ui .my-account-page input[type="number"],
body.woocommerce-account.shopro-account-ui .my-account-page input[type="date"],
body.woocommerce-account.shopro-account-ui .my-account-page textarea,
body.woocommerce-account.shopro-account-ui .my-account-page select,
body.woocommerce-account.shopro-account-ui .my-account-page .select2-selection {
	font-size: 16px;
}

/* WooCommerce 11 owns password wrapping, visibility state and accessibility. */
body.woocommerce-account.shopro-account-ui form .password-input {
	position: relative;
	display: flex;
	width: 100%;
	min-width: 0;
}

body.woocommerce-account.shopro-account-ui form .password-input input {
	width: 100%;
	padding-inline-end: 54px !important;
}

body.woocommerce-account.shopro-account-ui form .show-password-input {
	position: absolute;
	inset-inline-end: 7px;
	top: 50%;
	width: 40px;
	height: 40px;
	min-height: 40px;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 9px !important;
	background: #eef2f7 !important;
	color: var(--shopro-account-blue) !important;
	box-shadow: none !important;
	transform: translateY(-50%);
}

body.woocommerce-account.shopro-account-ui form .show-password-input:hover,
body.woocommerce-account.shopro-account-ui form .show-password-input:focus {
	background: #e2e9f2 !important;
	box-shadow: none !important;
}

/* Current WooCommerce Orders table; no one-table-per-order Machic fragments. */
body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table {
	display: table;
	width: 100%;
	margin: 0 0 24px !important;
	table-layout: auto !important;
	font-size: 15px !important;
}

body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table th,
body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table td {
	vertical-align: middle;
	font-size: 14px;
	line-height: 1.5;
	white-space: normal;
	overflow-wrap: anywhere;
}

body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table thead th {
	padding: 16px 15px !important;
	font-size: 11px;
	line-height: 1.35;
	white-space: nowrap;
}

body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table tbody td,
body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table tbody th {
	padding: 18px 15px !important;
}

body.woocommerce-account.shopro-account-ui .woocommerce-orders-table__cell-order-status {
	min-width: 170px;
}

body.woocommerce-account.shopro-account-ui .woocommerce-orders-table__cell-order-actions {
	min-width: 185px;
	white-space: normal;
}

body.woocommerce-account.shopro-account-ui .woocommerce-orders-table__cell-order-actions .button {
	min-height: 40px;
	margin: 4px 4px 4px 0 !important;
	padding: 0 13px;
	font-size: 12px;
	line-height: 1.25;
}

body.woocommerce-account.shopro-account-ui .shopro-order-status {
	font-size: 11px;
}

/* Long extension labels, emails and action names must wrap instead of breaking the layout. */
body.woocommerce-account.shopro-account-ui .shopro-account-profile__copy,
body.woocommerce-account.shopro-account-ui .shopro-account-nav__label,
body.woocommerce-account.shopro-account-ui .shopro-shortcut__copy,
body.woocommerce-account.shopro-account-ui .shopro-order-card,
body.woocommerce-account.shopro-account-ui .woocommerce-MyAccount-content {
	overflow-wrap: anywhere;
}

@media (max-width: 1180px) {
	body.woocommerce-account.shopro-account-ui .shopro-product-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 1024px) {
	body.woocommerce-account.shopro-account-ui .shopro-account-layout {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 20px !important;
	}

	body.woocommerce-account.shopro-account-ui .shopro-account-navigation-wrap {
		position: static !important;
	}

	body.woocommerce-account.shopro-account-ui .woocommerce-MyAccount-content,
	body.woocommerce-account.shopro-account-ui .shopro-account-content {
		padding: 26px !important;
	}
}

@media (max-width: 767px) {
	body.woocommerce-account.shopro-account-ui .shopro-account-shell,
	body.woocommerce-account.shopro-account-ui .shopro-login-shell {
		padding-inline: 0;
	}

	body.woocommerce-account.shopro-account-ui #customer_login.shopro-login-grid,
	body.woocommerce-account.shopro-account-ui #customer_login.shopro-login-grid.shopro-login-grid--single,
	body.woocommerce-account.shopro-account-ui .shopro-stat-grid,
	body.woocommerce-account.shopro-account-ui .shopro-order-grid,
	body.woocommerce-account.shopro-account-ui .shopro-product-grid {
		grid-template-columns: minmax(0, 1fr) !important;
	}

	body.woocommerce-account.shopro-account-ui #customer_login > .shopro-auth-card,
	body.woocommerce-account.shopro-account-ui #customer_login > .u-column1,
	body.woocommerce-account.shopro-account-ui #customer_login > .u-column2,
	body.woocommerce-account.shopro-account-ui #customer_login > .col-1,
	body.woocommerce-account.shopro-account-ui #customer_login > .col-2 {
		padding: 22px !important;
	}

	body.woocommerce-account.shopro-account-ui .woocommerce-MyAccount-content,
	body.woocommerce-account.shopro-account-ui .shopro-account-content {
		padding: 20px !important;
	}

	body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table {
		display: block;
		font-size: 14px !important;
	}

	body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table tbody,
	body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table tr {
		display: block;
		width: 100%;
	}

	body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table th,
	body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table td {
		font-size: 14px;
	}

	body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table td::before,
	body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table th::before {
		font-size: 12px;
	}

	body.woocommerce-account.shopro-account-ui .woocommerce-orders-table__cell-order-status,
	body.woocommerce-account.shopro-account-ui .woocommerce-orders-table__cell-order-actions {
		min-width: 0;
	}
}

/* Custom Shopro headings must not inherit Machic's small uppercase endpoint heading rule. */
body.woocommerce-account.shopro-account-ui .shopro-account-header h2,
body.woocommerce-account.shopro-account-ui .shopro-login-intro h2,
body.woocommerce-account.shopro-account-ui .shopro-auth-card__heading h2,
body.woocommerce-account.shopro-account-ui .shopro-dashboard__header h2,
body.woocommerce-account.shopro-account-ui .shopro-panel__heading h3,
body.woocommerce-account.shopro-account-ui .shopro-orders-intro h2,
body.woocommerce-account.shopro-account-ui .shopro-account-help h3,
body.woocommerce-account.shopro-account-ui .shopro-order-tracker h2,
body.woocommerce-account.shopro-account-ui .shopro-empty-state h4,
body.woocommerce-account.shopro-account-ui .shopro-order-card h4,
body.woocommerce-account.shopro-account-ui .shopro-product-card h4 {
	padding: 0 !important;
	border: 0 !important;
	text-transform: none !important;
}

/* The card is the visual form container; remove WooCommerce's second nested form frame. */
body.woocommerce-account.shopro-account-ui .shopro-auth-card form.login,
body.woocommerce-account.shopro-account-ui .shopro-auth-card form.register {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}

/* Desktop safety in case a cache/minifier exposes WooCommerce small-screen table rules globally. */
@media (min-width: 768px) {
	body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table {
		display: table !important;
	}

	body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table thead {
		display: table-header-group !important;
	}

	body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table tbody {
		display: table-row-group !important;
	}

	body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table tr {
		display: table-row !important;
	}

	body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table th,
	body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table td {
		display: table-cell !important;
		width: auto !important;
		text-align: start !important;
	}

	body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table th::before,
	body.woocommerce-account.shopro-account-ui table.woocommerce-orders-table td::before {
		display: none !important;
		content: none !important;
	}
}