/**
 * Eko Grid — My Account (design tokens applied via inline :root from PHP).
 *
 * Scope: body.eko-grid-my-account / body.woocommerce-account
 * Excludes Eko Header drawer: :not(.eko-header__account-wc-nav)
 */

/* -------------------------------------------------------------------------
   Fallback tokens (overridden by wp_add_inline_style when available)
   ------------------------------------------------------------------------- */

:root {
	--eko-grid-primary: #3b6ea5;
	--eko-grid-primary-soft: rgba(59, 110, 165, 0.12);
	--eko-grid-success: #2f7a57;
	--eko-grid-success-soft: rgba(47, 122, 87, 0.12);
	--eko-grid-warning: #a67c2a;
	--eko-grid-warning-soft: rgba(166, 124, 42, 0.14);
	--eko-grid-danger: #b54a4a;
	--eko-grid-danger-soft: rgba(181, 74, 74, 0.12);
	--eko-grid-surface: #f5f7fa;
	--eko-grid-surface-elevated: #ffffff;
	--eko-grid-text: #243041;
	--eko-grid-muted: #6b7785;
	--eko-grid-border: #e6e9ee;
	--eko-grid-radius: 10px;
	--eko-grid-radius-sm: 6px;
	--eko-grid-shadow: 0 1px 2px rgba(36, 48, 65, 0.04), 0 4px 14px rgba(36, 48, 65, 0.05);
	--eko-grid-transition: background-color 0.18s ease, color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

/* -------------------------------------------------------------------------
   Layout — neutralize Storefront sidebar floats
   ------------------------------------------------------------------------- */

body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-navigation:not(.eko-header__account-wc-nav),
body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-content {
	float: none;
	width: 100%;
	max-width: 100%;
	margin-left: 0;
	margin-right: 0;
}

body.woocommerce-account.eko-grid-my-account .woocommerce::after {
	content: "";
	display: table;
	clear: both;
}

body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-content {
	color: var(--eko-grid-text);
	padding-top: 0.25rem;
}

body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-content > *:first-child {
	margin-top: 0;
}

body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-content h2,
body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-content h3 {
	color: var(--eko-grid-text);
	font-weight: 600;
	letter-spacing: -0.01em;
}

/* -------------------------------------------------------------------------
   Navigation — elegant pill buttons
   ------------------------------------------------------------------------- */

body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-navigation:not(.eko-header__account-wc-nav) {
	margin: 0 0 1.75rem;
	padding: 0.65rem;
	background: var(--eko-grid-surface);
	border-radius: var(--eko-grid-radius);
	box-shadow: var(--eko-grid-shadow);
}

body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-navigation:not(.eko-header__account-wc-nav) ul {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 0.4rem;
	margin: 0;
	padding: 0;
	list-style: none;
	border: 0;
}

body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-navigation:not(.eko-header__account-wc-nav) ul li {
	list-style: none;
	margin: 0;
	padding: 0;
	border: 0;
	position: static;
	flex: 0 1 auto;
}

body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-navigation:not(.eko-header__account-wc-nav) ul li a {
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	gap: 0.55em;
	min-height: 2.75rem;
	padding: 0.55rem 0.95rem;
	color: var(--eko-grid-text);
	font-size: 0.9375rem;
	font-weight: 500;
	line-height: 1;
	text-decoration: none;
	background: transparent;
	border: 1px solid transparent;
	border-radius: var(--eko-grid-radius-sm);
	box-shadow: none;
	transition: var(--eko-grid-transition);
	white-space: nowrap;
}

/* Storefront FA ::before — flex-aligned glyph (no float / no absolute) */
body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-navigation:not(.eko-header__account-wc-nav) ul li a::before {
	float: none !important; /* Storefront floats icons right */
	position: static !important;
	top: auto !important;
	right: auto !important;
	left: auto !important;
	display: block;
	box-sizing: content-box;
	width: 1em;
	height: 1em;
	margin: 0;
	padding: 0;
	flex-shrink: 0;
	font-size: 1em;
	line-height: 1;
	text-align: center;
	vertical-align: middle;
	opacity: 0.72;
	color: var(--eko-grid-muted);
	transition: var(--eko-grid-transition);
	/* Optical centering for Font Awesome glyphs in flex row */
	transform: translateY(0.04em);
}

body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-navigation:not(.eko-header__account-wc-nav) ul li a:hover {
	background: var(--eko-grid-surface-elevated);
	border-color: var(--eko-grid-border);
	color: var(--eko-grid-primary);
}

body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-navigation:not(.eko-header__account-wc-nav) ul li a:hover::before {
	opacity: 1;
	color: var(--eko-grid-primary);
}

body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-navigation:not(.eko-header__account-wc-nav) ul li.is-active a {
	background: var(--eko-grid-primary-soft);
	border-color: transparent;
	color: var(--eko-grid-primary);
	font-weight: 600;
	box-shadow: inset 0 0 0 1px rgba(59, 110, 165, 0.08);
}

body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-navigation:not(.eko-header__account-wc-nav) ul li.is-active a::before {
	opacity: 1;
	color: var(--eko-grid-primary);
}

body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-navigation:not(.eko-header__account-wc-nav) ul li a:focus {
	outline: none;
}

body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-navigation:not(.eko-header__account-wc-nav) ul li a:focus-visible {
	outline: 2px solid var(--eko-grid-primary);
	outline-offset: 2px;
}

/*
 * Safety net if a <br> still appears inside nav links (origin stripped in PHP).
 * Scoped to Eko Grid My Account nav only — not Eko Header drawer.
 */
body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-navigation:not(.eko-header__account-wc-nav) ul li a > br {
	display: none;
}

/* -------------------------------------------------------------------------
   Mobile nav — comfortable touch grid
   ------------------------------------------------------------------------- */

@media (max-width: 767px) {
	body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-navigation:not(.eko-header__account-wc-nav) {
		padding: 0.5rem;
	}

	body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-navigation:not(.eko-header__account-wc-nav) ul {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0.4rem;
	}

	body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-navigation:not(.eko-header__account-wc-nav) ul li a {
		width: 100%;
		min-height: 3rem;
		padding: 0.65rem 0.75rem;
		white-space: normal;
		box-sizing: border-box;
	}
}

@media (max-width: 360px) {
	body.woocommerce-account.eko-grid-my-account .woocommerce-MyAccount-navigation:not(.eko-header__account-wc-nav) ul {
		grid-template-columns: 1fr;
	}
}

/* -------------------------------------------------------------------------
   Status badges (shared — used on orders; safe if unused elsewhere)
   ------------------------------------------------------------------------- */

body.eko-grid-my-account .eko-grid-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	max-width: 100%;
	padding: 0.28em 0.7em;
	font-size: 0.8125rem;
	font-weight: 600;
	line-height: 1.3;
	border-radius: 999px;
	background: var(--eko-grid-surface);
	color: var(--eko-grid-muted);
	white-space: nowrap;
}

body.eko-grid-my-account .eko-grid-badge__dot {
	width: 0.45em;
	height: 0.45em;
	border-radius: 50%;
	background: currentColor;
	flex-shrink: 0;
	opacity: 0.9;
}

body.eko-grid-my-account .eko-grid-badge--completed {
	background: var(--eko-grid-success-soft);
	color: var(--eko-grid-success);
}

body.eko-grid-my-account .eko-grid-badge--processing {
	background: var(--eko-grid-primary-soft);
	color: var(--eko-grid-primary);
}

body.eko-grid-my-account .eko-grid-badge--on-hold,
body.eko-grid-my-account .eko-grid-badge--pending {
	background: var(--eko-grid-warning-soft);
	color: var(--eko-grid-warning);
}

body.eko-grid-my-account .eko-grid-badge--cancelled,
body.eko-grid-my-account .eko-grid-badge--failed {
	background: var(--eko-grid-danger-soft);
	color: var(--eko-grid-danger);
}

body.eko-grid-my-account .eko-grid-badge--refunded {
	background: var(--eko-grid-surface);
	color: var(--eko-grid-muted);
	box-shadow: inset 0 0 0 1px var(--eko-grid-border);
}

/* -------------------------------------------------------------------------
   WooCommerce notices — scoped to account context only
   ------------------------------------------------------------------------- */

body.eko-grid-my-account .woocommerce-notices-wrapper {
	margin: 0 0 1.25rem;
}

body.eko-grid-my-account .woocommerce-message,
body.eko-grid-my-account .woocommerce-info,
body.eko-grid-my-account .woocommerce-error,
body.eko-grid-my-account .woocommerce-noreviews,
body.eko-grid-my-account p.no-comments {
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
	gap: 0.65rem 0.85rem;
	margin: 0 0 0.75rem;
	padding: 0.9rem 1.1rem;
	border: 0;
	border-radius: var(--eko-grid-radius-sm);
	box-shadow: var(--eko-grid-shadow);
	color: var(--eko-grid-text);
	line-height: 1.45;
	position: relative;
	list-style: none;
}

body.eko-grid-my-account .woocommerce-message {
	background: var(--eko-grid-success-soft);
	box-shadow: inset 3px 0 0 var(--eko-grid-success), var(--eko-grid-shadow);
}

body.eko-grid-my-account .woocommerce-info {
	background: var(--eko-grid-primary-soft);
	box-shadow: inset 3px 0 0 var(--eko-grid-primary), var(--eko-grid-shadow);
}

body.eko-grid-my-account .woocommerce-error,
body.eko-grid-my-account .woocommerce-error li {
	background: var(--eko-grid-danger-soft);
	color: var(--eko-grid-text);
}

body.eko-grid-my-account .woocommerce-error {
	box-shadow: inset 3px 0 0 var(--eko-grid-danger), var(--eko-grid-shadow);
	list-style: none;
}

/*
 * Neutralize Storefront/WC absolute FA ::before (overlaps text after padding reset).
 * Replace with in-flow SVG mask — no Font Awesome dependency.
 */
body.eko-grid-my-account .woocommerce-message::before,
body.eko-grid-my-account .woocommerce-info::before,
body.eko-grid-my-account .woocommerce-error::before {
	content: "" !important;
	position: static !important;
	top: auto !important;
	left: auto !important;
	right: auto !important;
	float: none !important;
	display: block;
	width: 1.15em;
	height: 1.15em;
	margin: 0.2em 0 0;
	padding: 0;
	flex-shrink: 0;
	font-family: inherit !important;
	font-size: 1em !important;
	font-weight: 400 !important;
	line-height: 1 !important;
	speak: never;
	background-color: currentColor;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
	opacity: 1;
}

body.eko-grid-my-account .woocommerce-info::before {
	color: var(--eko-grid-primary);
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z'/%3E%3C/svg%3E");
}

body.eko-grid-my-account .woocommerce-message::before {
	color: var(--eko-grid-success);
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm-1.1 14.2-3.6-3.6 1.4-1.4 2.2 2.2 4.7-4.7 1.4 1.4-6.1 6.1z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm-1.1 14.2-3.6-3.6 1.4-1.4 2.2 2.2 4.7-4.7 1.4 1.4-6.1 6.1z'/%3E%3C/svg%3E");
}

body.eko-grid-my-account .woocommerce-error::before {
	color: var(--eko-grid-danger);
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm1 14h-2v-2h2v2zm0-4h-2V7h2v5z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm1 14h-2v-2h2v2zm0-4h-2V7h2v5z'/%3E%3C/svg%3E");
}

/* Dark action button inside info notice only — not all account links */
body.eko-grid-my-account .woocommerce-info a.button,
body.eko-grid-my-account .woocommerce-info a.woocommerce-Button,
body.eko-grid-my-account .woocommerce-info .button,
body.eko-grid-my-account .woocommerce-info a.wc-forward {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 0.5rem 0.95rem;
	border: 1px solid transparent;
	border-radius: var(--eko-grid-radius-sm);
	background: var(--eko-grid-text);
	color: #fff;
	font-size: 0.875rem;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	box-shadow: none;
	transition: var(--eko-grid-transition);
}

body.eko-grid-my-account .woocommerce-info a.button:hover,
body.eko-grid-my-account .woocommerce-info a.woocommerce-Button:hover,
body.eko-grid-my-account .woocommerce-info .button:hover,
body.eko-grid-my-account .woocommerce-info a.wc-forward:hover {
	background: #1a2330;
	color: #fff;
}

body.eko-grid-my-account .woocommerce-info a.button:focus-visible,
body.eko-grid-my-account .woocommerce-info a.woocommerce-Button:focus-visible,
body.eko-grid-my-account .woocommerce-info .button:focus-visible,
body.eko-grid-my-account .woocommerce-info a.wc-forward:focus-visible {
	outline: 2px solid var(--eko-grid-primary);
	outline-offset: 2px;
}

/* -------------------------------------------------------------------------
   Account addresses list (edit-address hub)
   ------------------------------------------------------------------------- */

body.eko-grid-my-account .woocommerce-Addresses,
body.eko-grid-my-account .u-columns.woocommerce-Addresses {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
	float: none;
	width: 100%;
	margin: 1rem 0 0;
}

body.eko-grid-my-account .woocommerce-Address {
	float: none;
	width: 100% !important;
	margin: 0;
	padding: 1.1rem 1.2rem;
	border-radius: var(--eko-grid-radius);
	background: var(--eko-grid-surface-elevated);
	border: 1px solid var(--eko-grid-border);
	box-shadow: var(--eko-grid-shadow);
	box-sizing: border-box;
}

body.eko-grid-my-account .woocommerce-Address-title {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.75rem;
	margin: 0 0 0.75rem;
	padding: 0;
	border: 0;
}

body.eko-grid-my-account .woocommerce-Address-title h2,
body.eko-grid-my-account .woocommerce-Address-title h3 {
	margin: 0;
	font-size: 1rem;
	font-weight: 600;
	color: var(--eko-grid-text);
}

body.eko-grid-my-account .woocommerce-Address-title .edit {
	color: var(--eko-grid-primary);
	font-size: 0.875rem;
	font-weight: 600;
	text-decoration: none;
}

body.eko-grid-my-account .woocommerce-Address address {
	margin: 0;
	font-style: normal;
	font-size: 0.9375rem;
	line-height: 1.55;
	color: var(--eko-grid-text);
}

/* -------------------------------------------------------------------------
   Edit Account / Edit Address forms
   ------------------------------------------------------------------------- */

body.eko-grid-my-account .woocommerce-EditAccountForm,
body.eko-grid-my-account .woocommerce-address-fields,
body.eko-grid-edit-account .woocommerce-MyAccount-content > form,
body.eko-grid-edit-address .woocommerce-MyAccount-content > form {
	max-width: 40rem;
	margin: auto;
}

body.eko-grid-my-account .woocommerce-EditAccountForm .woocommerce-form-row,
body.eko-grid-my-account .woocommerce-address-fields .form-row,
body.eko-grid-my-account .woocommerce-MyAccount-content .form-row {
	margin: 0 0 1rem;
	padding: 0;
}

body.eko-grid-my-account .woocommerce-EditAccountForm label,
body.eko-grid-my-account .woocommerce-address-fields label,
body.eko-grid-my-account .woocommerce-MyAccount-content .form-row > label {
	display: block;
	margin: 0 0 0.4rem;
	color: var(--eko-grid-text);
	font-size: 0.875rem;
	font-weight: 600;
	line-height: 1.35;
}

body.eko-grid-my-account .woocommerce-EditAccountForm .required,
body.eko-grid-my-account .woocommerce-address-fields .required,
body.eko-grid-my-account .woocommerce-MyAccount-content .form-row .required {
	color: var(--eko-grid-danger);
	text-decoration: none;
}

body.eko-grid-my-account .woocommerce-EditAccountForm .woocommerce-Input,
body.eko-grid-my-account .woocommerce-EditAccountForm input.input-text,
body.eko-grid-my-account .woocommerce-EditAccountForm select,
body.eko-grid-my-account .woocommerce-EditAccountForm textarea,
body.eko-grid-my-account .woocommerce-address-fields .input-text,
body.eko-grid-my-account .woocommerce-address-fields select,
body.eko-grid-my-account .woocommerce-address-fields textarea,
body.eko-grid-my-account .woocommerce-MyAccount-content .form-row .input-text,
body.eko-grid-my-account .woocommerce-MyAccount-content .form-row select,
body.eko-grid-my-account .woocommerce-MyAccount-content .form-row textarea {
	box-sizing: border-box;
	width: 100%;
	min-height: 2.75rem;
	margin: 0;
	padding: 0.6rem 0.85rem;
	border: 1px solid var(--eko-grid-border);
	border-radius: var(--eko-grid-radius-sm);
	background: var(--eko-grid-surface-elevated);
	color: var(--eko-grid-text);
	font-size: 0.9375rem;
	line-height: 1.4;
	box-shadow: none;
	transition: var(--eko-grid-transition);
}

body.eko-grid-my-account .woocommerce-EditAccountForm textarea,
body.eko-grid-my-account .woocommerce-address-fields textarea,
body.eko-grid-my-account .woocommerce-MyAccount-content .form-row textarea {
	min-height: 6rem;
	resize: vertical;
}

body.eko-grid-my-account .woocommerce-EditAccountForm .woocommerce-Input:hover,
body.eko-grid-my-account .woocommerce-EditAccountForm select:hover,
body.eko-grid-my-account .woocommerce-address-fields .input-text:hover,
body.eko-grid-my-account .woocommerce-address-fields select:hover,
body.eko-grid-my-account .woocommerce-MyAccount-content .form-row .input-text:hover,
body.eko-grid-my-account .woocommerce-MyAccount-content .form-row select:hover {
	border-color: #cfd5dd;
}

body.eko-grid-my-account .woocommerce-EditAccountForm .woocommerce-Input:focus,
body.eko-grid-my-account .woocommerce-EditAccountForm select:focus,
body.eko-grid-my-account .woocommerce-EditAccountForm textarea:focus,
body.eko-grid-my-account .woocommerce-address-fields .input-text:focus,
body.eko-grid-my-account .woocommerce-address-fields select:focus,
body.eko-grid-my-account .woocommerce-address-fields textarea:focus,
body.eko-grid-my-account .woocommerce-MyAccount-content .form-row .input-text:focus,
body.eko-grid-my-account .woocommerce-MyAccount-content .form-row select:focus,
body.eko-grid-my-account .woocommerce-MyAccount-content .form-row textarea:focus {
	border-color: var(--eko-grid-primary);
	box-shadow: 0 0 0 3px var(--eko-grid-primary-soft);
	outline: none;
}

body.eko-grid-my-account .woocommerce-EditAccountForm em,
body.eko-grid-my-account .woocommerce-EditAccountForm .woocommerce-form-row span em,
body.eko-grid-my-account .woocommerce-MyAccount-content .form-row .description {
	display: block;
	margin-top: 0.35rem;
	color: var(--eko-grid-muted);
	font-size: 0.8125rem;
	font-style: normal;
	line-height: 1.45;
}

/* Personal info group before password fieldset */
body.eko-grid-edit-account .woocommerce-EditAccountForm {
	padding: 1.15rem 1.25rem;
	border-radius: var(--eko-grid-radius);
	background: var(--eko-grid-surface);
	box-shadow: var(--eko-grid-shadow);
}

body.eko-grid-edit-account .woocommerce-EditAccountForm .form-row-first,
body.eko-grid-edit-account .woocommerce-EditAccountForm .form-row-last,
body.eko-grid-edit-address .woocommerce-address-fields .form-row-first,
body.eko-grid-edit-address .woocommerce-address-fields .form-row-last {
	float: none;
	width: 100%;
	margin-right: 0;
}

@media (min-width: 768px) {
	body.eko-grid-edit-account .woocommerce-EditAccountForm .form-row-first,
	body.eko-grid-edit-account .woocommerce-EditAccountForm .form-row-last {
		display: inline-block;
		vertical-align: top;
		width: 48.5%;
	}

	body.eko-grid-edit-account .woocommerce-EditAccountForm .form-row-first {
		margin-right: 3%;
	}
}

body.eko-grid-edit-account .woocommerce-EditAccountForm fieldset {
	margin: 1.35rem 0 0;
	padding: 1.1rem 1.15rem 0.25rem;
	border: 1px solid var(--eko-grid-border);
	border-radius: var(--eko-grid-radius-sm);
	background: var(--eko-grid-surface-elevated);
}

body.eko-grid-edit-account .woocommerce-EditAccountForm fieldset legend {
	padding: 0 0.4rem;
	color: var(--eko-grid-text);
	font-size: 0.9rem;
	font-weight: 600;
}

body.eko-grid-edit-address .woocommerce-address-fields,
body.eko-grid-edit-address .woocommerce-MyAccount-content > form {
	padding: 1.15rem 1.25rem;
	border-radius: var(--eko-grid-radius);
	background: var(--eko-grid-surface);
	box-shadow: var(--eko-grid-shadow);
}

body.eko-grid-edit-address .woocommerce-MyAccount-content h2,
body.eko-grid-edit-address .woocommerce-MyAccount-content h3 {
	margin: 0 0 1rem;
	color: var(--eko-grid-text);
	font-size: 1.1rem;
	font-weight: 600;
}

body.eko-grid-my-account .woocommerce-EditAccountForm .button,
body.eko-grid-my-account .woocommerce-address-fields .button,
body.eko-grid-edit-account .woocommerce-EditAccountForm button,
body.eko-grid-edit-address .woocommerce-address-fields button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 2.65rem;
	margin-top: 0.35rem;
	padding: 0.6rem 1.2rem;
	border: 0;
	border-radius: var(--eko-grid-radius-sm);
	background: var(--eko-grid-primary);
	color: #fff;
	font-size: 0.9rem;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	transition: var(--eko-grid-transition);
}

body.eko-grid-my-account .woocommerce-EditAccountForm .button:hover,
body.eko-grid-my-account .woocommerce-address-fields .button:hover,
body.eko-grid-edit-account .woocommerce-EditAccountForm button:hover,
body.eko-grid-edit-address .woocommerce-address-fields button:hover {
	filter: brightness(0.95);
	color: #fff;
}

body.eko-grid-my-account .woocommerce-EditAccountForm .button:focus-visible,
body.eko-grid-my-account .woocommerce-address-fields .button:focus-visible {
	outline: 2px solid var(--eko-grid-primary);
	outline-offset: 2px;
}

@media (max-width: 767px) {
	body.eko-grid-my-account .woocommerce-Addresses,
	body.eko-grid-my-account .u-columns.woocommerce-Addresses {
		grid-template-columns: 1fr;
	}

	body.eko-grid-edit-account .woocommerce-EditAccountForm,
	body.eko-grid-edit-address .woocommerce-address-fields,
	body.eko-grid-edit-address .woocommerce-MyAccount-content > form {
		padding: 1rem;
	}
	body.eko-grid-my-account .woocommerce-Address-title {
		display:block ;
	}
}