/* ==========================================================================
   OmegAmino replica — My Account + auth screens
   --------------------------------------------------------------------------
   Owner: tuju-account.  Files in this subsystem:
     inc/oma-account.php · woocommerce/myaccount/*.php · assets/css/oma-account.css

   Everything here is scoped to `.woocommerce-account`, `.oma-account-layout`,
   `.oma-auth*` or `body.oma-auth-page` so it can never leak into the shop,
   product, cart or checkout templates other agents own.

   Measured against the source (BeTheme 28.5.4) at 1440 / 820 / 390:
     sidebar card   30% wide, bg rgba(0,0,0,.03), radius 8px, padding 15px
     nav link       rgba(0,0,0,.6) 18px, radius 5px, padding 7px 10px, icon 22px + 10px gap
     nav active     rgba(0,0,0,.8) on rgba(0,0,0,.045)
     logout row     separated by 1px rgba(0,0,0,.08), padding-top/margin-top 5px
     content col    66% at 1440, 100% under 960
     inputs         padding 12px 20px, radius 9px, border rgba(0,0,0,.5)
     buttons        #84F2FE bg / #000 text / radius 9px / 18px 400, hover #76E4F3
     notices        #F5F7F8, radius 10px, padding 15px 20px, no glyph
   ========================================================================== */

.woocommerce-account {
	--oma-blue: #1c6bba;
	--oma-cyan: #84f2fe;
	--oma-cyan-hover: #76e4f3;
	--oma-ink: #000;
	--oma-muted: rgba(0, 0, 0, 0.6);
	--oma-line: rgba(0, 0, 0, 0.08);
	--oma-panel: rgba(0, 0, 0, 0.03);
	--oma-panel-active: rgba(0, 0, 0, 0.05);
	--oma-tint: #f5f7f8;
	--oma-radius: 9px;
	--oma-radius-box: 8px;
	--oma-font: "Inter Tight", "Inter", Arial, Helvetica, sans-serif;
}

.oma-auth,
.oma-auth-screen {
	--oma-blue: #1c6bba;
	--oma-cyan: #84f2fe;
	--oma-cyan-hover: #76e4f3;
	--oma-muted: rgba(0, 0, 0, 0.6);
	--oma-line: rgba(0, 0, 0, 0.08);
	--oma-tint: #f5f7f8;
	--oma-radius: 9px;
	--oma-font: "Inter Tight", "Inter", Arial, Helvetica, sans-serif;
}

/* --------------------------------------------------------------------------
   1. Two-column layout
   -------------------------------------------------------------------------- */

.oma-account-layout {
	display: grid;
	grid-template-columns: 30% minmax(0, 1fr);
	column-gap: 52px;
	align-items: start;
	font-family: var(--oma-font);
}

/*
 * No clearfix pseudo-elements on a grid container: ::before/::after become GRID ITEMS and push
 * the real children into the wrong cells. WooCommerce's own `.col2-set::before/::after`
 * clearfix does exactly that to the address grid, so it is neutralised below too.
 */
.oma-account-layout::before,
.oma-account-layout::after {
	content: none;
	display: none;
}

/* Neutralise WooCommerce's / BeTheme's float rules inside our grid. */
.woocommerce-account .oma-account-layout .woocommerce-MyAccount-navigation,
.woocommerce-account .oma-account-layout .woocommerce-MyAccount-content {
	float: none;
	width: auto;
	margin: 0;
	min-width: 0;
}

/* --------------------------------------------------------------------------
   2. Sidebar navigation — the five locked items
   -------------------------------------------------------------------------- */

.woocommerce-account .oma-account-layout .woocommerce-MyAccount-navigation {
	background: var(--oma-panel);
	border-radius: var(--oma-radius-box);
	padding: 15px;
	box-sizing: border-box;
}

.woocommerce-account .oma-account-layout .woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.woocommerce-account .oma-account-layout .woocommerce-MyAccount-navigation ul li {
	margin: 0 0 1px;
	padding: 0;
	list-style: none;
}

.woocommerce-account .oma-account-layout .woocommerce-MyAccount-navigation ul li::before {
	content: none;
}

.woocommerce-account .oma-account-layout .woocommerce-MyAccount-navigation ul li a {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	padding: 9px 12px;
	border: 0;
	border-radius: 5px;
	background: transparent;
	color: var(--oma-muted);
	font-family: var(--oma-font);
	font-size: 18px;
	line-height: 1.3;
	font-weight: 400;
	text-decoration: none;
	transition: background-color 0.2s, color 0.2s;
}

/* The known prior defect: two-word labels wrapping onto a second line. */
.woocommerce-account .oma-account-layout .woocommerce-MyAccount-navigation ul li a .oma-account-nav__label {
	flex: 1 1 auto;
	min-width: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.woocommerce-account .oma-account-layout .woocommerce-MyAccount-navigation ul li a:hover,
.woocommerce-account .oma-account-layout .woocommerce-MyAccount-navigation ul li a:focus,
.woocommerce-account .oma-account-layout .woocommerce-MyAccount-navigation ul li.is-active a {
	background-color: var(--oma-panel-active);
	color: rgba(0, 0, 0, 0.85);
	text-decoration: none;
}

.woocommerce-account .oma-account-layout .woocommerce-MyAccount-navigation ul li.is-active a {
	font-weight: 500;
}

.woocommerce-account .oma-account-layout .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--customer-logout {
	border-top: 1px solid var(--oma-line);
	margin-top: 6px;
	padding-top: 6px;
}

/* Icons — inline SVG masks, tinted with the link colour. No icon font needed. */
.oma-account-nav__icon {
	flex: 0 0 22px;
	width: 22px;
	height: 22px;
	background-color: currentColor;
	opacity: 0.85;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: 19px 19px;
	mask-size: 19px 19px;
}

.oma-account-nav__icon--dashboard {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1.5'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1.5'/%3E%3C/svg%3E");
}

.oma-account-nav__icon--orders {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 2.6-6.4'/%3E%3Cpolyline points='3 4 3 9 8 9'/%3E%3Cpolyline points='12 7.5 12 12.5 15.5 14.5'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 2.6-6.4'/%3E%3Cpolyline points='3 4 3 9 8 9'/%3E%3Cpolyline points='12 7.5 12 12.5 15.5 14.5'/%3E%3C/svg%3E");
}

.oma-account-nav__icon--edit-address {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2v20'/%3E%3Cpath d='M12 4h7l2.5 3L19 10h-7z'/%3E%3Cpath d='M12 12H5l-2.5 3L5 18h7z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2v20'/%3E%3Cpath d='M12 4h7l2.5 3L19 10h-7z'/%3E%3Cpath d='M12 12H5l-2.5 3L5 18h7z'/%3E%3C/svg%3E");
}

.oma-account-nav__icon--edit-account {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3.2'/%3E%3Cpath d='M19.4 15a1.6 1.6 0 0 0 .32 1.77l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.6 1.6 0 0 0-1.77-.32 1.6 1.6 0 0 0-1 1.46V21a2 2 0 0 1-4 0v-.11a1.6 1.6 0 0 0-1.05-1.46 1.6 1.6 0 0 0-1.77.32l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06A1.6 1.6 0 0 0 4.6 15a1.6 1.6 0 0 0-1.46-1H3a2 2 0 0 1 0-4h.11A1.6 1.6 0 0 0 4.6 9a1.6 1.6 0 0 0-.33-1.77l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06A1.6 1.6 0 0 0 8.87 4.7 1.6 1.6 0 0 0 9.87 3.24V3a2 2 0 0 1 4 0v.11a1.6 1.6 0 0 0 1 1.46 1.6 1.6 0 0 0 1.77-.32l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06A1.6 1.6 0 0 0 19.4 9v.05a1.6 1.6 0 0 0 1.46 1H21a2 2 0 0 1 0 4h-.11a1.6 1.6 0 0 0-1.46 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' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3.2'/%3E%3Cpath d='M19.4 15a1.6 1.6 0 0 0 .32 1.77l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.6 1.6 0 0 0-1.77-.32 1.6 1.6 0 0 0-1 1.46V21a2 2 0 0 1-4 0v-.11a1.6 1.6 0 0 0-1.05-1.46 1.6 1.6 0 0 0-1.77.32l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06A1.6 1.6 0 0 0 4.6 15a1.6 1.6 0 0 0-1.46-1H3a2 2 0 0 1 0-4h.11A1.6 1.6 0 0 0 4.6 9a1.6 1.6 0 0 0-.33-1.77l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06A1.6 1.6 0 0 0 8.87 4.7 1.6 1.6 0 0 0 9.87 3.24V3a2 2 0 0 1 4 0v.11a1.6 1.6 0 0 0 1 1.46 1.6 1.6 0 0 0 1.77-.32l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06A1.6 1.6 0 0 0 19.4 9v.05a1.6 1.6 0 0 0 1.46 1H21a2 2 0 0 1 0 4h-.11a1.6 1.6 0 0 0-1.46 1z'/%3E%3C/svg%3E");
}

.oma-account-nav__icon--customer-logout {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpolyline points='16 17 21 12 16 7'/%3E%3Cline x1='21' y1='12' x2='9' y2='12'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpolyline points='16 17 21 12 16 7'/%3E%3Cline x1='21' y1='12' x2='9' y2='12'/%3E%3C/svg%3E");
}

/* Any endpoint we did not draw an icon for still gets a bullet-free row. */
.oma-account-nav__icon:not([class*="--dashboard"]):not([class*="--orders"]):not([class*="--edit-address"]):not([class*="--edit-account"]):not([class*="--customer-logout"]) {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}

/* --------------------------------------------------------------------------
   3. Content column
   -------------------------------------------------------------------------- */

.woocommerce-account .woocommerce-MyAccount-content {
	font-family: var(--oma-font);
	font-size: 18px;
	line-height: 1.45;
	color: var(--oma-ink);
}

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

.woocommerce-account .woocommerce-MyAccount-content p {
	margin: 0 0 14px;
}

.woocommerce-account .woocommerce-MyAccount-content h2 {
	font-family: var(--oma-font);
	font-size: 27px;
	line-height: 1.3;
	font-weight: 600;
	color: var(--oma-ink);
	margin: 0 0 12px;
}

.woocommerce-account .woocommerce-MyAccount-content a {
	color: var(--oma-blue);
	text-decoration: none;
}

.woocommerce-account .woocommerce-MyAccount-content a:hover {
	text-decoration: underline;
}

.woocommerce-account .woocommerce-MyAccount-content mark {
	background: transparent;
	color: inherit;
	font-weight: 600;
}

.oma-back-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 16px;
}

.oma-back-link::before {
	content: "\2039";
	font-size: 22px;
	line-height: 1;
}

/* --------------------------------------------------------------------------
   4. Buttons + notices
   -------------------------------------------------------------------------- */

.woocommerce-account .woocommerce-MyAccount-content .button,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Button,
.woocommerce-account .woocommerce-MyAccount-content button[type="submit"],
.woocommerce-account .woocommerce-MyAccount-content input[type="submit"] {
	display: inline-block;
	background: var(--oma-cyan);
	color: #000;
	border: 0;
	border-radius: var(--oma-radius);
	padding: 12px 20px;
	font-family: var(--oma-font);
	font-size: 18px;
	line-height: 1.2;
	font-weight: 400;
	text-decoration: none;
	cursor: pointer;
	box-shadow: none;
	transition: background-color 0.2s;
}

.woocommerce-account .woocommerce-MyAccount-content .button:hover,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Button:hover,
.woocommerce-account .woocommerce-MyAccount-content button[type="submit"]:hover,
.woocommerce-account .woocommerce-MyAccount-content input[type="submit"]:hover {
	background: var(--oma-cyan-hover);
	color: #000;
	text-decoration: none;
}

.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-error,
.woocommerce-account .woocommerce-notices-wrapper .woocommerce-info,
.woocommerce-account .woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-account .woocommerce-notices-wrapper .woocommerce-error {
	position: relative;
	background-color: var(--oma-tint);
	border: 0;
	border-top: 0;
	border-radius: 10px;
	color: var(--oma-ink);
	padding: 15px 20px;
	margin: 0 0 24px;
	list-style: none;
	font-size: 18px;
	line-height: 1.45;
}

.woocommerce-account .woocommerce-info::before,
.woocommerce-account .woocommerce-message::before,
.woocommerce-account .woocommerce-error::before {
	display: none;
	content: none;
}

.woocommerce-account .woocommerce-error {
	background-color: #fdf1f1;
}

.woocommerce-account .woocommerce-message {
	background-color: #f1f8f1;
}

.woocommerce-account .woocommerce-info .button,
.woocommerce-account .woocommerce-message .button,
.woocommerce-account .woocommerce-error .button {
	float: right;
	margin-left: 20px;
	margin-top: 0;
}

.woocommerce-account .woocommerce-error li,
.woocommerce-account .woocommerce-info li,
.woocommerce-account .woocommerce-message li {
	list-style: none;
	margin-left: 0;
	padding-left: 0;
}

/* --------------------------------------------------------------------------
   5. Forms (account details + address)
   -------------------------------------------------------------------------- */

.woocommerce-account .woocommerce-MyAccount-content .form-row {
	display: block;
	margin: 0 0 18px;
	padding: 0;
}

.woocommerce-account .woocommerce-MyAccount-content .form-row label {
	display: block;
	margin: 0 0 8px;
	font-family: var(--oma-font);
	font-size: 18px;
	line-height: 1.3;
	font-weight: 500;
	color: var(--oma-ink);
}

.woocommerce-account .woocommerce-MyAccount-content .form-row .required {
	color: #bf2e35;
	text-decoration: none;
	border: 0;
}

.woocommerce-account .woocommerce-MyAccount-content input[type="text"],
.woocommerce-account .woocommerce-MyAccount-content input[type="email"],
.woocommerce-account .woocommerce-MyAccount-content input[type="tel"],
.woocommerce-account .woocommerce-MyAccount-content input[type="password"],
.woocommerce-account .woocommerce-MyAccount-content input[type="number"],
.woocommerce-account .woocommerce-MyAccount-content textarea,
.woocommerce-account .woocommerce-MyAccount-content select,
.woocommerce-account .woocommerce-MyAccount-content .select2-container .select2-selection--single {
	width: 100%;
	box-sizing: border-box;
	padding: 12px 20px;
	border: 1px solid rgba(0, 0, 0, 0.5);
	border-radius: var(--oma-radius);
	background: #fff;
	color: #383838;
	font-family: var(--oma-font);
	font-size: 16px;
	line-height: 1.4;
	box-shadow: none;
	height: auto;
}

.woocommerce-account .woocommerce-MyAccount-content input:focus,
.woocommerce-account .woocommerce-MyAccount-content textarea:focus,
.woocommerce-account .woocommerce-MyAccount-content select:focus {
	outline: none;
	border-color: var(--oma-blue);
}

.woocommerce-account .woocommerce-MyAccount-content .select2-container .select2-selection--single {
	display: flex;
	align-items: center;
}

.woocommerce-account .woocommerce-MyAccount-content .select2-container .select2-selection--single .select2-selection__rendered {
	padding: 0;
	line-height: 1.4;
	color: #383838;
}

.woocommerce-account .woocommerce-MyAccount-content .select2-container .select2-selection--single .select2-selection__arrow {
	top: 50%;
	transform: translateY(-50%);
	right: 12px;
}

.woocommerce-account .woocommerce-MyAccount-content #account_display_name_description em,
.woocommerce-account .woocommerce-MyAccount-content .description {
	display: block;
	margin-top: 6px;
	font-size: 15px;
	color: var(--oma-muted);
}

.woocommerce-account .woocommerce-MyAccount-content fieldset,
.woocommerce-account .woocommerce-MyAccount-content .oma-fieldset {
	border: 0;
	margin: 26px 0 0;
	padding: 0;
}

.woocommerce-account .woocommerce-MyAccount-content fieldset legend {
	padding: 0;
	margin: 0 0 14px;
	font-family: var(--oma-font);
	font-size: 18px;
	font-weight: 500;
	color: var(--oma-ink);
}

/* Two-up rows, matching the source's First name / Last name pair. */
@media only screen and (min-width: 768px) {

	.woocommerce-account .woocommerce-MyAccount-content .form-row-first,
	.woocommerce-account .woocommerce-MyAccount-content .form-row-last {
		float: left;
		width: 48.5%;
	}

	.woocommerce-account .woocommerce-MyAccount-content .form-row-last {
		float: right;
	}

	.woocommerce-account .woocommerce-MyAccount-content .clear {
		clear: both;
		display: block;
	}
}

.woocommerce-account .woocommerce-MyAccount-content .oma-account-optin .oma-auth__check {
	font-size: 16px;
	font-weight: 400;
}

/* --------------------------------------------------------------------------
   6. Addresses
   -------------------------------------------------------------------------- */

/*
 * WooCommerce ships `.woocommerce .col2-set::before/::after { content:" "; display:table }`
 * (0,2,1 specificity) — as grid items those two phantom boxes take cells 1 and 3 and push the
 * real address blocks into the wrong columns. Must out-specify it, not just match it.
 */
.woocommerce .woocommerce-Addresses.oma-addresses::before,
.woocommerce .woocommerce-Addresses.oma-addresses::after,
.woocommerce-account .oma-addresses::before,
.woocommerce-account .oma-addresses::after {
	content: none;
	display: none;
}

.oma-addresses {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 34px;
	margin-top: 6px;
}

.oma-addresses--1 {
	grid-template-columns: minmax(0, 1fr);
}

.woocommerce-account .oma-addresses .woocommerce-Address {
	float: none;
	width: auto;
	margin: 0;
}

.woocommerce-account .woocommerce-Address-title {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 8px 16px;
	margin-bottom: 12px;
}

.woocommerce-account .woocommerce-Address-title h2 {
	margin: 0;
}

.woocommerce-account .woocommerce-Address-title .edit {
	font-size: 16px;
	color: var(--oma-blue);
	white-space: nowrap;
}

.woocommerce-account .woocommerce-Address address {
	display: flex;
	align-items: flex-start;
	gap: 20px;
	font-style: normal;
	font-size: 17px;
	line-height: 1.5;
	color: var(--oma-ink);
	border: 1px solid var(--oma-line);
	border-radius: var(--oma-radius-box);
	padding: 18px 20px;
	background: var(--oma-panel);
}

.woocommerce-account .woocommerce-Address address::before {
	content: "";
	flex: 0 0 28px;
	width: 28px;
	align-self: stretch;
	min-height: 46px;
	padding-right: 20px;
	border-right: 1px solid var(--oma-line);
	background-color: rgba(0, 0, 0, 0.7);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: left center;
	mask-position: left center;
	-webkit-mask-size: 26px 26px;
	mask-size: 26px 26px;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='2.5' width='16' height='19' rx='2'/%3E%3Cline x1='8' y1='7.5' x2='16' y2='7.5'/%3E%3Cline x1='8' y1='12' x2='16' y2='12'/%3E%3Cline x1='8' y1='16.5' x2='13' y2='16.5'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='2.5' width='16' height='19' rx='2'/%3E%3Cline x1='8' y1='7.5' x2='16' y2='7.5'/%3E%3Cline x1='8' y1='12' x2='16' y2='12'/%3E%3Cline x1='8' y1='16.5' x2='13' y2='16.5'/%3E%3C/svg%3E");
}

/* --------------------------------------------------------------------------
   7. Orders table
   -------------------------------------------------------------------------- */

.oma-orders {
	overflow-x: auto;
}

.woocommerce-account table.woocommerce-orders-table,
.woocommerce-account table.my_account_orders {
	width: 100%;
	border-collapse: collapse;
	font-size: 17px;
	margin: 0 0 24px;
}

.woocommerce-account table.woocommerce-orders-table th,
.woocommerce-account table.woocommerce-orders-table td {
	text-align: left;
	padding: 14px 16px;
	border: 0;
	border-bottom: 1px solid var(--oma-line);
	vertical-align: middle;
}

.woocommerce-account table.woocommerce-orders-table thead th {
	background: var(--oma-panel);
	font-weight: 600;
	color: var(--oma-ink);
	white-space: nowrap;
}

.woocommerce-account table.woocommerce-orders-table thead th:first-child {
	border-top-left-radius: var(--oma-radius-box);
	border-bottom-left-radius: var(--oma-radius-box);
}

.woocommerce-account table.woocommerce-orders-table thead th:last-child {
	border-top-right-radius: var(--oma-radius-box);
	border-bottom-right-radius: var(--oma-radius-box);
}

.woocommerce-account table.woocommerce-orders-table tbody th {
	font-weight: 500;
}

.oma-order-status {
	display: inline-block;
	padding: 4px 12px;
	border-radius: 100px;
	background: var(--oma-panel-active);
	font-size: 15px;
	line-height: 1.5;
	white-space: nowrap;
}

.oma-order-status--processing,
.oma-order-status--completed {
	background: #e6f6ea;
}

.oma-order-status--on-hold,
.oma-order-status--pending {
	background: #fdf4e3;
}

.oma-order-status--cancelled,
.oma-order-status--failed,
.oma-order-status--refunded {
	background: #fbeaea;
}

.woocommerce-account table.woocommerce-orders-table td.woocommerce-orders-table__cell-order-actions {
	text-align: right;
	white-space: nowrap;
}

.woocommerce-account table.woocommerce-orders-table td.woocommerce-orders-table__cell-order-actions .button {
	padding: 8px 16px;
	font-size: 16px;
	margin: 2px 0 2px 8px;
	float: none;
}

.woocommerce-account .woocommerce-pagination {
	display: flex;
	gap: 12px;
	margin: 0 0 24px;
}

/* --------------------------------------------------------------------------
   8. Auth screens — /login/, /register/ and logged-out /my-account/
   -------------------------------------------------------------------------- */

.oma-auth-screen {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: stretch;
	min-height: 700px;
	font-family: var(--oma-font);
	/* Full-bleed out of whatever container the page template provides. */
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

.oma-auth-screen__media {
	position: relative;
	display: flex;
	align-items: flex-start;
	padding: 48px 60px;
	background-color: var(--oma-blue);
	background-image: linear-gradient(150deg, #1c6bba 0%, #16324f 60%, #07070a 100%);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.oma-auth-screen.has-image .oma-auth-screen__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0.05) 40%);
	pointer-events: none;
}

.oma-auth-screen__logo {
	position: relative;
	z-index: 1;
	display: inline-block;
	max-width: 250px;
}

.oma-auth-screen__logo img {
	display: block;
	width: 100%;
	height: auto;
}

.oma-auth-screen__logo--text {
	color: #fff;
	font-size: 30px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
}

.oma-auth-screen__form {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 70px 60px;
	background: #fff;
}

.oma-auth-screen__form > .oma-auth {
	width: 100%;
	max-width: 600px;
}

/* The card itself (also used inline on /my-account/ when logged out). */
.oma-auth {
	font-family: var(--oma-font);
	color: #000;
}

.oma-auth--single {
	max-width: 600px;
	margin: 0 auto;
}

.oma-auth__panel[hidden] {
	display: none;
}

.oma-auth__title {
	font-family: var(--oma-font);
	font-size: 65px;
	line-height: 1;
	font-weight: 600;
	color: #000;
	margin: 0 0 25px;
}

.oma-auth__lede {
	font-size: 18px;
	line-height: 1.45;
	margin: 0 0 15px;
	color: #000;
}

.oma-auth__lede--muted {
	color: var(--oma-muted);
	font-size: 16px;
}

.oma-auth__lede a,
.oma-auth__forgot a,
.oma-auth__check a {
	color: var(--oma-blue);
	text-decoration: none;
}

.oma-auth__lede a:hover,
.oma-auth__forgot a:hover,
.oma-auth__check a:hover {
	text-decoration: underline;
}

.oma-auth__form {
	margin-top: 50px;
}

.oma-auth--single .oma-auth__form {
	margin-top: 30px;
}

.oma-auth__row {
	display: flex;
	gap: 10px;
}

.oma-auth__row--full {
	flex-direction: column;
}

.oma-auth__field {
	position: relative;
	width: 100%;
}

.oma-auth__input {
	width: 100%;
	box-sizing: border-box;
	padding: 16px 20px;
	margin-bottom: 12px;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 8px;
	background: #fff;
	box-shadow: none;
	font-family: var(--oma-font);
	font-size: 16px;
	line-height: 1.4;
	color: #383838;
}

.oma-auth__input::placeholder {
	color: rgba(0, 0, 0, 0.45);
}

.oma-auth__input:focus {
	outline: none;
	background: none;
	border-color: var(--oma-blue);
}

.oma-auth__input.has-error {
	border: 1px solid #bf2e35;
}

.oma-auth__input--password {
	padding-right: 52px;
}

.oma-auth__eye {
	position: absolute;
	right: 17px;
	top: 27px;
	transform: translateY(-50%);
	width: 22px;
	height: 22px;
	padding: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
	line-height: 0;
}

.oma-auth__eye::before {
	content: "";
	display: block;
	width: 22px;
	height: 22px;
	background-color: rgba(0, 0, 0, 0.6);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: 20px 20px;
	mask-size: 20px 20px;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.6 12S5.3 5.5 12 5.5 22.4 12 22.4 12 18.7 18.5 12 18.5 1.6 12 1.6 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1.6 12S5.3 5.5 12 5.5 22.4 12 22.4 12 18.7 18.5 12 18.5 1.6 12 1.6 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}

.oma-auth__eye.is-visible::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.9 5.7A9.9 9.9 0 0 1 12 5.5c6.7 0 10.4 6.5 10.4 6.5a18 18 0 0 1-3.4 4.2M6.1 6.9A17.6 17.6 0 0 0 1.6 12S5.3 18.5 12 18.5a9.9 9.9 0 0 0 4.2-.9'/%3E%3Cpath d='M9.9 9.9a3 3 0 0 0 4.2 4.2'/%3E%3Cline x1='2.5' y1='2.5' x2='21.5' y2='21.5'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.9 5.7A9.9 9.9 0 0 1 12 5.5c6.7 0 10.4 6.5 10.4 6.5a18 18 0 0 1-3.4 4.2M6.1 6.9A17.6 17.6 0 0 0 1.6 12S5.3 18.5 12 18.5a9.9 9.9 0 0 0 4.2-.9'/%3E%3Cpath d='M9.9 9.9a3 3 0 0 0 4.2 4.2'/%3E%3Cline x1='2.5' y1='2.5' x2='21.5' y2='21.5'/%3E%3C/svg%3E");
}

.oma-auth__row--check {
	align-items: flex-start;
	margin-bottom: 10px;
}

.oma-auth__check {
	display: flex;
	align-items: flex-start;
	font-size: 14px;
	line-height: 1.5;
	color: #000;
	cursor: pointer;
	margin: 0;
	font-weight: 400;
}

.oma-auth__check input[type="checkbox"] {
	appearance: none;
	-webkit-appearance: none;
	flex: 0 0 16px;
	width: 16px;
	height: 16px;
	min-width: 16px;
	min-height: 16px;
	margin: 2px 10px 0 0;
	padding: 0;
	border: 1.5px solid #d9d9d9;
	border-radius: 3px;
	background-color: #fff;
	position: relative;
	cursor: pointer;
}

.oma-auth__check input[type="checkbox"]:checked::after {
	content: "";
	position: absolute;
	top: 1px;
	left: 4px;
	width: 4px;
	height: 8px;
	border: solid var(--oma-blue);
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

.oma-auth__check input[type="checkbox"].has-error {
	border-color: #bf2e35;
}

.oma-auth__forgot {
	margin: 4px 0 0;
	font-size: 16px;
}

.oma-auth__panel--reset .oma-auth__forgot {
	text-align: center;
	margin-top: 15px;
}

.oma-auth__submit,
.oma-auth__submit:visited {
	display: inline-block;
	width: 100%;
	box-sizing: border-box;
	margin-top: 25px;
	padding: 16.5px 20px;
	border: 0;
	border-radius: var(--oma-radius);
	background: var(--oma-cyan);
	color: #000;
	font-family: var(--oma-font);
	font-size: 18px;
	line-height: 1.2;
	font-weight: 400;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	position: relative;
	transition: background-color 0.2s;
}

#oma-register-form .oma-auth__submit {
	margin-top: 35px;
}

.oma-auth__submit:hover {
	background: var(--oma-cyan-hover);
	color: #000;
}

.oma-auth__submit.is-loading {
	pointer-events: none;
	opacity: 0.7;
}

.oma-auth__submit.is-loading::after {
	content: "";
	position: absolute;
	right: 18px;
	top: 50%;
	width: 16px;
	height: 16px;
	margin-top: -8px;
	border: 2px solid #000;
	border-top-color: transparent;
	border-radius: 50%;
	animation: oma-auth-spin 0.7s linear infinite;
}

@keyframes oma-auth-spin {

	to {
		transform: rotate(360deg);
	}
}

.oma-auth__error {
	display: block;
	margin: -6px 0 12px;
	color: #d00e17;
	font-size: 12px;
	line-height: 1.4;
}

.oma-auth__message {
	margin: 0;
	font-size: 16px;
	line-height: 1.45;
}

.oma-auth__message.is-error,
.oma-auth__message.is-success {
	margin: 0 0 20px;
	padding: 14px 18px;
	border-radius: 10px;
}

.oma-auth__message.is-error {
	background: #fdf1f1;
	color: #a3202a;
}

.oma-auth__message.is-success {
	background: #eef8f0;
	color: #1c5b2c;
}

/* WooCommerce notices printed above the card on the standalone auth pages. */
body.oma-auth-page .woocommerce-error,
body.oma-auth-page .woocommerce-info,
body.oma-auth-page .woocommerce-message {
	border-radius: 10px;
	border-top: 0;
	padding: 15px 20px;
	background-color: var(--oma-tint, #f5f7f8);
	list-style: none;
}

body.oma-auth-page .woocommerce-error::before,
body.oma-auth-page .woocommerce-info::before,
body.oma-auth-page .woocommerce-message::before {
	display: none;
	content: none;
}

/* Logged-out /my-account/ shows the card, not the split screen. */
.woocommerce-account .oma-auth {
	max-width: 600px;
}

/* --------------------------------------------------------------------------
   9. Responsive — breakpoints follow BeTheme's 1440 / 1100 / 959 / 767
   -------------------------------------------------------------------------- */

@media only screen and (max-width: 1100px) {

	.oma-account-layout {
		grid-template-columns: 34% minmax(0, 1fr);
		column-gap: 36px;
	}

	.oma-auth__title {
		font-size: 48px;
	}

	.oma-auth-screen__form,
	.oma-auth-screen__media {
		padding-left: 45px;
		padding-right: 45px;
	}
}

@media only screen and (max-width: 959px) {

	.oma-account-layout {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 34px;
	}

	.woocommerce-account .oma-account-layout .woocommerce-MyAccount-navigation ul {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 4px 10px;
	}

	.woocommerce-account .oma-account-layout .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--customer-logout {
		grid-column: 1 / -1;
	}

	.oma-addresses {
		grid-template-columns: minmax(0, 1fr);
		gap: 28px;
	}

	.oma-auth-screen {
		grid-template-columns: minmax(0, 1fr);
		min-height: 0;
	}

	.oma-auth-screen__media {
		min-height: 300px;
		padding: 40px 35px;
	}

	.oma-auth-screen__form {
		padding: 55px 35px 60px;
	}

	.oma-auth-screen__logo {
		max-width: 200px;
	}
}

@media only screen and (max-width: 767px) {

	.woocommerce-account .oma-account-layout .woocommerce-MyAccount-navigation ul {
		grid-template-columns: minmax(0, 1fr);
	}

	.woocommerce-account .woocommerce-MyAccount-content {
		font-size: 17px;
	}

	.woocommerce-account .woocommerce-MyAccount-content h2 {
		font-size: 24px;
	}

	/* Stacked order cards instead of a scrolling table. */
	.oma-orders {
		overflow: visible;
	}

	.woocommerce-account table.woocommerce-orders-table thead {
		display: none;
	}

	.woocommerce-account table.woocommerce-orders-table,
	.woocommerce-account table.woocommerce-orders-table tbody,
	.woocommerce-account table.woocommerce-orders-table tr,
	.woocommerce-account table.woocommerce-orders-table th,
	.woocommerce-account table.woocommerce-orders-table td {
		display: block;
		width: auto;
	}

	.woocommerce-account table.woocommerce-orders-table tr {
		border: 1px solid var(--oma-line);
		border-radius: var(--oma-radius-box);
		padding: 6px 4px;
		margin: 0 0 14px;
	}

	.woocommerce-account table.woocommerce-orders-table th,
	.woocommerce-account table.woocommerce-orders-table td {
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 16px;
		border: 0;
		border-bottom: 1px solid var(--oma-line);
		padding: 10px 12px;
		text-align: right;
	}

	.woocommerce-account table.woocommerce-orders-table tr > *:last-child {
		border-bottom: 0;
	}

	/*
	 * woocommerce-smallscreen.css (max-width:768) does
	 * `.woocommerce table.shop_table_responsive tbody th { display:none }`, which would swallow
	 * the order-number cell in our stacked card layout. Put it back.
	 */
	.woocommerce-account table.woocommerce-orders-table tbody th,
	.woocommerce-account table.shop_table_responsive tbody th {
		display: flex;
	}

	.woocommerce-account table.woocommerce-orders-table th::before,
	.woocommerce-account table.woocommerce-orders-table td::before {
		content: attr(data-title) ":";
		font-weight: 600;
		text-align: left;
		color: var(--oma-muted);
	}

	.oma-auth__title {
		font-size: 36px;
		margin-bottom: 18px;
	}

	.oma-auth__form {
		margin-top: 30px;
	}

	.oma-auth-screen__media {
		min-height: 220px;
		padding: 30px 20px;
	}

	.oma-auth-screen__form {
		padding: 45px 20px 50px;
	}

	.oma-auth-screen__logo {
		max-width: 170px;
	}

	.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info .button,
	.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message .button,
	.woocommerce-account .woocommerce-MyAccount-content .woocommerce-error .button {
		float: none;
		display: block;
		margin: 14px 0 0;
		text-align: center;
	}
}

@media only screen and (max-width: 580px) {

	.oma-auth__row {
		gap: 0;
		flex-direction: column;
	}
}

/* --------------------------------------------------------------------------
   10. Compact card — the header's off-canvas account panel
        (theme part: parts/account-panel.php, hook: oma_account_panel_form)
   -------------------------------------------------------------------------- */

.oma-auth--compact {
	max-width: none;
	margin-top: 6px;
}

.oma-auth--compact .oma-auth__title {
	font-size: 22px;
	line-height: 1.25;
	margin: 0 0 6px;
}

.oma-auth--compact .oma-auth__lede {
	font-size: 15px;
	margin: 0 0 6px;
}

.oma-auth--compact .oma-auth__form {
	margin-top: 14px;
}

.oma-auth--compact .oma-auth__input {
	padding: 11px 16px;
	margin-bottom: 10px;
	font-size: 15px;
}

.oma-auth--compact .oma-auth__eye {
	top: 22px;
}

.oma-auth--compact .oma-auth__submit {
	margin-top: 12px;
	padding: 12px 16px;
	font-size: 16px;
}

.oma-auth--compact .oma-auth__forgot {
	font-size: 14px;
}

.oma-auth--compact .oma-auth__message.is-error,
.oma-auth--compact .oma-auth__message.is-success {
	padding: 10px 12px;
	margin-bottom: 12px;
	font-size: 14px;
}