/* Icons for the native account navigation. */
.wpdef-main--account {
	--wpdef-account-user: url('../images/account-user.svg');
	--wpdef-account-orders: url('../images/account-orders.svg');
	--wpdef-account-downloads: url('../images/account-download.svg');
	--wpdef-account-address: url('../images/account-pin.svg');
	--wpdef-account-payment: url('../images/account-payment.svg');
}

/* Native WooCommerce account, scoped to the editable account page template. */
.wpdef-main--account {
	--wpdef-account-ink: var(--wp--custom--color--ink);
	--wpdef-account-muted: var(--wp--preset--color--muted);
	--wpdef-account-blue: var(--wp--preset--color--secondary);
	--wpdef-account-line: var(--wp--custom--color--line-1);
	background: linear-gradient(120deg, var(--wp--preset--color--background), var(--wp--preset--color--white) 65%);
	color: var(--wpdef-account-ink);
	font-size: 14px;
	line-height: 1.6;
}
.wp-site-blocks .wpdef-main--account { margin-block: 0; padding: 24px 24px 56px; }
.wpdef-main--account .wpdef-account-layout {
	display: grid;
	gap: 20px 24px;
	grid-template-columns: minmax(0, 1fr);
	margin: 0 auto;
	max-width: 1240px;
}
.wpdef-account-layout > * { margin-block: 0; min-width: 0; }
.wpdef-account-layout:has(.woocommerce-MyAccount-navigation) { grid-template-columns: 248px minmax(0, 1fr); grid-template-rows: max-content minmax(0, 1fr); }
.wpdef-account-layout:has(.woocommerce-MyAccount-navigation) .wpdef-account-native,
.wpdef-account-layout:has(.woocommerce-MyAccount-navigation) .wpdef-account-native > .woocommerce { display: contents; }
.wpdef-account-layout .woocommerce::before,
.wpdef-account-layout .woocommerce::after { display: none; }
.wpdef-account-layout:has(.woocommerce-MyAccount-navigation) .wpdef-account-banner { grid-column: 2; grid-row: 1; }
.wpdef-account-layout:has(.woocommerce-MyAccount-navigation) .woocommerce-MyAccount-content { grid-column: 2; grid-row: 2; }
.wpdef-account-layout .woocommerce-notices-wrapper:empty,
.wpdef-account-layout .wpdef-account-native > p:empty { display: none; }

/* Core blocks keep the welcome copy editable in the Site Editor. */
.wpdef-account-layout .wpdef-account-banner {
	background-color: var(--wp--preset--color--soft);
	background-image: linear-gradient(110deg, var(--wp--preset--color--background) 0%, var(--wp--custom--color--surface-3) 55%, var(--wp--custom--color--line-2) 100%);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	border: 1px solid var(--wp--custom--color--surface-3);
	border-radius: 12px;
	min-height: 180px;
	overflow: hidden;
	padding: 26px 28px;
}
.wpdef-account-layout .wpdef-account-banner__eyebrow { color: var(--wp--preset--color--secondary); font-size: 12px; font-weight: 700; letter-spacing: 0.12em; line-height: 1.5; margin: 0 0 6px; text-transform: uppercase; }
.wpdef-account-layout .wpdef-account-banner__title { color: var(--wp--custom--color--ink); font-size: clamp(27px, 2.8vw, 34px); font-weight: 750; letter-spacing: -0.03em; line-height: 1.15; margin: 0 0 10px; }
.wpdef-account-layout .wpdef-account-banner__lead { color: var(--wpdef-account-muted); font-size: 14px; line-height: 1.65; margin: 0; max-width: 42rem; }

/* Sidebar: the complete native account menu. */
.wp-site-blocks .wpdef-main--account .woocommerce-MyAccount-navigation {
	align-self: stretch;
	background: linear-gradient(155deg, var(--wp--preset--color--background), var(--wp--preset--color--soft));
	border: 1px solid var(--wp--preset--color--soft);
	border-radius: 12px;
	float: none;
	grid-column: 1;
	grid-row: 1 / 3;
	margin: 0;
	min-height: 640px;
	min-width: 0;
	overflow: hidden;
	padding: 22px 12px 80px;
	position: relative;
	width: auto;
}
.wpdef-main--account .woocommerce-MyAccount-navigation::after { border: 40px solid color-mix(in srgb, var(--wp--custom--color--line-1) 52%, transparent); border-radius: 50%; bottom: -140px; content: ''; height: 280px; pointer-events: none; position: absolute; right: -170px; transform: rotate(-24deg); width: 360px; }
.wpdef-main--account .woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; position: relative; z-index: 1; }
.wpdef-main--account .woocommerce-MyAccount-navigation li { border: 0; list-style: none; margin: 3px 0; padding: 0; }
.wpdef-main--account .woocommerce-MyAccount-navigation li a { align-items: center; border: 1px solid transparent; border-radius: 8px; color: var(--wpdef-account-ink); display: flex; font-size: 13px; font-weight: 600; gap: 12px; line-height: 1.4; min-height: 44px; padding: 11px 12px; text-decoration: none; }
.wpdef-main--account .woocommerce-MyAccount-navigation li a:hover { background: var(--wp--custom--color--surface-3); }
.wp-site-blocks .wpdef-main--account .woocommerce-MyAccount-navigation li.is-active a { background: var(--wp--custom--color--line-1); color: var(--wp--preset--color--secondary); text-decoration: none; }
.wpdef-main--account .woocommerce-MyAccount-navigation li a::before { background: currentColor; content: ''; flex: 0 0 20px; height: 20px; mask: var(--wpdef-account-icon, var(--wpdef-account-orders)) center / contain no-repeat; width: 20px; }
.woocommerce-MyAccount-navigation-link--dashboard { --wpdef-account-icon: url('../images/account-home.svg'); }
.woocommerce-MyAccount-navigation-link--downloads { --wpdef-account-icon: var(--wpdef-account-downloads); }
.woocommerce-MyAccount-navigation-link--orders { --wpdef-account-icon: var(--wpdef-account-orders); }
.woocommerce-MyAccount-navigation-link--edit-address { --wpdef-account-icon: var(--wpdef-account-address); }
.woocommerce-MyAccount-navigation-link--edit-account { --wpdef-account-icon: var(--wpdef-account-user); }
.woocommerce-MyAccount-navigation-link--payment-methods { --wpdef-account-icon: var(--wpdef-account-payment); }
.woocommerce-MyAccount-navigation-link--customer-logout { --wpdef-account-icon: url('../images/account-logout.svg'); }

/* The endpoint, notices, forms, validation and download permissions stay native. */
.wp-site-blocks .wpdef-main--account .woocommerce-MyAccount-content,
.wpdef-account-layout:not(:has(.woocommerce-MyAccount-navigation)) .wpdef-account-native {
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wpdef-account-line);
	border-radius: 12px;
	box-shadow: 0 3px 14px color-mix(in srgb, var(--wp--custom--color--ink) 2%, transparent);
	float: none;
	margin: 0;
	min-width: 0;
	padding: 24px;
	width: 100%;
}
.wpdef-account-layout:not(:has(.woocommerce-MyAccount-navigation)) { max-width: 980px; }
/* A login or password form on its own reads better in a narrow card; with registration
   enabled, WooCommerce places both forms side by side in #customer_login. */
.wpdef-account-layout:not(:has(.woocommerce-MyAccount-navigation, #customer_login)) { max-width: 30rem; }
.wpdef-main--account .wpdef-account-title { color: var(--wpdef-account-ink); font-size: 20px; font-weight: 700; letter-spacing: -0.02em; line-height: 1.3; margin: 0 0 24px; }
.wpdef-main--account .woocommerce-info { align-items: center; background: var(--wp--preset--color--soft); border: 1px solid var(--wpdef-account-line); border-radius: 8px; color: var(--wpdef-account-muted); display: flex; flex-wrap: wrap; font-size: 13px; gap: 14px; justify-content: space-between; line-height: 1.6; margin: 0 0 20px; padding: 22px; }
.wpdef-main--account .woocommerce-info::before,
.wpdef-main--account .woocommerce-info::after { display: none; }
.wpdef-main--account .wc-block-components-notice-banner.is-info { align-items: center; background: var(--wp--preset--color--soft); border: 1px solid var(--wpdef-account-line); border-radius: 8px; color: var(--wpdef-account-muted); font-size: 13px; gap: 14px; margin: 0 0 20px; padding: 18px !important; }
.wpdef-main--account .wc-block-components-notice-banner.is-info > svg { background: var(--wp--custom--color--surface-3); fill: var(--wp--preset--color--secondary); flex: 0 0 24px; }
/* Notice text contains inline emphasis and links; keep it in normal text flow. */
.wpdef-main--account .wc-block-components-notice-banner__content { display: block; min-width: 0; overflow-wrap: anywhere; }
.wpdef-main--account .wc-block-components-notice-banner.is-error {
	align-items: flex-start;
	background: var(--wp--custom--color--error-surface);
	border: 1px solid var(--wp--custom--color--error-surface);
	border-inline-start: 3px solid var(--wp--preset--color--error);
	border-radius: 8px;
	color: var(--wp--preset--color--error);
	font-size: 14px;
	gap: 12px;
	line-height: 1.65;
	margin: 0 0 24px;
	padding: 16px 18px !important;
}
.wpdef-main--account .wc-block-components-notice-banner.is-error > svg {
	background: var(--wp--custom--color--error-surface);
	box-sizing: border-box;
	fill: var(--wp--preset--color--error);
	flex: 0 0 24px;
	height: 24px;
	margin-top: 1px;
	width: 24px;
}
.wpdef-main--account .wc-block-components-notice-banner.is-error > .wc-block-components-notice-banner__content { align-self: flex-start; }
.wpdef-main--account .wc-block-components-notice-banner.is-error strong { font-weight: 700; }
.wpdef-main--account .wc-block-components-notice-banner.is-error a:not(.button) { color: var(--wp--preset--color--error); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.wpdef-main--account .wc-block-components-notice-banner.is-error a:not(.button):hover { color: var(--wp--preset--color--error); }
.wpdef-main--account .wc-block-components-notice-banner.is-error:focus-visible { outline: 2px solid var(--wp--preset--color--error); outline-offset: 3px; }
.wp-site-blocks .wpdef-main--account .wc-block-components-notice-banner .wc-block-components-notice-banner__content a.button { background: var(--wp--preset--color--white) !important; border: 1px solid var(--wp--custom--color--line-2); color: var(--wp--preset--color--secondary) !important; font-size: 12px; min-height: 40px; opacity: 1; padding: 9px 14px !important; text-decoration: none; }
.wp-site-blocks .wpdef-main--account .wc-block-components-notice-banner .wc-block-components-notice-banner__content a.button:hover { background: var(--wp--custom--color--surface-3) !important; }
.wpdef-main--account .woocommerce-error,
.wpdef-main--account .woocommerce-message { border-radius: 8px; font-size: 14px; }
.wpdef-main--account .woocommerce-error a,
.wpdef-main--account .woocommerce-message a { overflow-wrap: anywhere; }
.wp-site-blocks .wpdef-main--account :is(.button, button.button, a.button) { align-items: center; background: linear-gradient(105deg, var(--wp--preset--color--secondary), var(--wp--preset--color--accent)); border: 1px solid transparent; border-radius: 7px; color: var(--wp--preset--color--white); display: inline-flex; font-size: 12px; font-weight: 650; gap: 8px; justify-content: center; line-height: 1.4; min-height: 42px; padding: 11px 17px; text-align: center; text-decoration: none; }
.wp-site-blocks .wpdef-main--account :is(.button, button.button, a.button):hover { background: var(--wp--preset--color--accent); color: var(--wp--preset--color--white); }
.wpdef-main--account :where(a, button, input, select):focus-visible { outline: 2px solid var(--wp--preset--color--secondary); outline-offset: 3px; }

/* Download and order tables retain the WooCommerce column structure. */
.wpdef-main--account .woocommerce-MyAccount-content table.shop_table { border: 1px solid var(--wp--custom--color--surface-3); border-collapse: separate; border-radius: 8px; border-spacing: 0; font-size: 12px; margin: 0; overflow: hidden; text-align: start; width: 100%; }
.wpdef-main--account .woocommerce-MyAccount-content table.shop_table th { background: var(--wp--preset--color--soft); border: 0; color: var(--wp--custom--color--ink); font-size: 12px; font-weight: 650; line-height: 1.45; padding: 14px 16px; }
.wpdef-main--account .woocommerce-MyAccount-content table.shop_table td { border: 0; border-top: 1px solid var(--wp--custom--color--surface-3); line-height: 1.6; padding: 16px; vertical-align: middle; }
/* WooCommerce marks the order number as the row's header cell. It keeps that role but reads as a body cell, so the first column no longer looks like part of the header. */
.wpdef-main--account .woocommerce-MyAccount-content table.shop_table tbody th { background: none; border-top: 1px solid var(--wp--custom--color--surface-3); line-height: 1.6; padding: 16px; vertical-align: middle; }
.wpdef-main--account .woocommerce-MyAccount-content table.shop_table th + th,
.wpdef-main--account .woocommerce-MyAccount-content table.shop_table :is(th, td) + td { border-left: 1px solid var(--wp--custom--color--surface-2); }
.wpdef-main--account .woocommerce-MyAccount-content td a:not(.button) { color: var(--wpdef-account-ink); font-weight: 650; text-decoration: none; }
.wpdef-main--account .woocommerce-MyAccount-content td a:not(.button):hover { text-decoration: underline; }
.wpdef-main--account .woocommerce-order-downloads { margin-bottom: 24px; }
.wpdef-main--account table.shop_table .download-remaining,
.wpdef-main--account table.shop_table .download-expires { color: var(--wpdef-account-muted); }

/* Native login, registration, address and account forms. */
.wpdef-main--account :is(.woocommerce-MyAccount-content, .wpdef-account-native) h2 { color: var(--wpdef-account-ink); font-size: 22px; line-height: 1.35; }
.wpdef-main--account .woocommerce form :is(input.input-text, select, textarea),
.wpdef-main--account .select2-container .select2-selection--single { background: var(--wp--preset--color--white); border: 1px solid var(--wp--preset--color--border); border-radius: 6px; color: var(--wpdef-account-ink); font-size: 14px; line-height: 1.5; min-height: 44px; padding: 10px 12px; }
.wpdef-main--account .woocommerce form .form-row label { color: var(--wp--preset--color--accent); font-size: 13px; font-weight: 600; margin-bottom: 5px; }
.wpdef-main--account .woocommerce form .form-row { margin-bottom: 18px; padding: 0; }
.wpdef-main--account .woocommerce form .form-row em,
.wpdef-main--account .woocommerce form .form-row span.description { color: var(--wpdef-account-muted); font-size: 12px; }
.wpdef-main--account .woocommerce form :is(fieldset, .woocommerce-address-fields) { border: 1px solid var(--wpdef-account-line); border-radius: 8px; margin: 24px 0; padding: 20px; }
.wpdef-main--account .woocommerce form legend { color: var(--wpdef-account-ink); font-size: 16px; font-weight: 700; padding: 0 8px; }
.wpdef-main--account .woocommerce form :is(.password-input input) { padding-right: 52px; }
.wpdef-main--account .woocommerce form :is(input[type="checkbox"], input[type="radio"]) { accent-color: var(--wpdef-account-blue); }
.wpdef-main--account .woocommerce form.login,
.wpdef-main--account .woocommerce form.register { border: 0; margin: 0; padding: 0; }
.wpdef-main--account .woocommerce form.login .form-row:has(.woocommerce-form-login__submit) { align-items: center; display: flex; flex-wrap: wrap; gap: 16px; }
.wpdef-main--account .woocommerce form.login .woocommerce-form-login__submit { float: none; margin: 0; }
.wpdef-main--account .woocommerce-Addresses { display: grid; gap: 20px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.wpdef-main--account .woocommerce-Addresses::before,
.wpdef-main--account .woocommerce-Addresses::after { display: none; }
.wpdef-main--account .woocommerce-Addresses .woocommerce-Address { background: var(--wp--preset--color--background); border: 1px solid var(--wpdef-account-line); border-radius: 8px; float: none; padding: 20px; width: 100%; }
.wpdef-main--account .woocommerce-Addresses h2 { font-size: 17px; margin-top: 0; }
.wpdef-main--account .woocommerce-Addresses address { font-size: 13px; font-style: normal; }

@media (max-width: 1100px) {
	.wpdef-account-layout:has(.woocommerce-MyAccount-navigation) { gap: 18px; grid-template-columns: 218px minmax(0, 1fr); }
	.wpdef-main--account .woocommerce-MyAccount-content table.shop_table :is(td, th) { padding: 12px; }
	.wpdef-account-layout .wpdef-account-banner { padding: 24px; }
}
@media (max-width: 800px) {
	.wp-site-blocks .wpdef-main--account { padding: 20px 16px 36px; }
	.wpdef-account-layout:has(.woocommerce-MyAccount-navigation) { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto; }
	.wp-site-blocks .wpdef-account-layout:has(.woocommerce-MyAccount-navigation) .woocommerce-MyAccount-navigation { grid-column: 1; grid-row: 1; min-height: 0; padding: 16px; }
	.wpdef-account-layout:has(.woocommerce-MyAccount-navigation) .wpdef-account-banner { grid-column: 1; grid-row: 2; }
	.wpdef-account-layout:has(.woocommerce-MyAccount-navigation) .woocommerce-MyAccount-content { grid-column: 1; grid-row: 3; }
	.wpdef-main--account .woocommerce-MyAccount-navigation::after { display: none; }
	.wpdef-main--account .woocommerce-MyAccount-navigation ul { display: flex; flex-wrap: wrap; gap: 4px; }
	.wpdef-main--account .woocommerce-MyAccount-navigation li { margin: 0; }
	.wpdef-main--account .woocommerce-MyAccount-navigation li a { font-size: 12px; gap: 8px; padding: 10px; }
	.wpdef-main--account .woocommerce-MyAccount-content table.shop_table_responsive thead { display: none; }
	.wpdef-main--account .woocommerce-MyAccount-content table.shop_table_responsive tr { background: white; display: block; padding: 12px 16px; }
	.wpdef-main--account .woocommerce-MyAccount-content table.shop_table_responsive tr + tr { border-top: 1px solid var(--wpdef-account-line); }
	/* WooCommerce's small-screen sheet hides header cells in the body, which took the order number with it, and a flex row split "R$ 187,00 de 5 itens" into columns. Each cell is a line with its label floated beside the value. */
	.wpdef-main--account .woocommerce-MyAccount-content table.shop_table_responsive :is(tbody th, td) { background: none; border: 0; display: flow-root; padding: 8px 0; text-align: end; width: 100%; }
	.wpdef-main--account .woocommerce-MyAccount-content table.shop_table_responsive :is(tbody th, td)::before { color: var(--wp--preset--color--muted); content: attr(data-title) ': '; float: inline-start; font-weight: 600; margin-inline-end: 16px; text-align: start; }
}
@media (max-width: 520px) {
	.wpdef-account-layout .wpdef-account-banner { min-height: 162px; padding: 22px; }
	.wpdef-account-layout .wpdef-account-banner__title { font-size: 28px; max-width: none; }
	.wpdef-account-layout .wpdef-account-banner__lead { font-size: 13px; max-width: none; }
	.wp-site-blocks .wpdef-main--account .woocommerce-MyAccount-content,
	.wpdef-account-layout:not(:has(.woocommerce-MyAccount-navigation)) .wpdef-account-native { padding: 18px; }
	.wpdef-main--account .woocommerce-Addresses { grid-template-columns: minmax(0, 1fr); }
	.wpdef-main--account .woocommerce form :is(.form-row-first, .form-row-last) { float: none; width: 100%; }
	.wpdef-main--account .woocommerce form fieldset { padding: 16px; }
}

/* Endpoints without an introductory header start alongside the sidebar. */
.wpdef-account-layout:has(.woocommerce-MyAccount-navigation):not(:has(.wpdef-account-banner)) { grid-template-rows: auto; }
.wp-site-blocks .wpdef-account-layout:has(.woocommerce-MyAccount-navigation):not(:has(.wpdef-account-banner)) .woocommerce-MyAccount-navigation { grid-row: 1; }
.wpdef-account-layout:has(.woocommerce-MyAccount-navigation):not(:has(.wpdef-account-banner)) .woocommerce-MyAccount-content { align-self: start; grid-row: 1; }
@media (max-width: 800px) {
	.wpdef-account-layout:has(.woocommerce-MyAccount-navigation):not(:has(.wpdef-account-banner)) .woocommerce-MyAccount-content { grid-row: 2; }
}
