/* My Account — ported verbatim from Claude Design "My Account.html". */

.acct-shell { max-width: 1400px; margin: 0 auto; padding: 40px 32px 80px; }
.acct-greet { display: flex; justify-content: space-between; align-items: end; gap: 32px; padding: 0 0 28px; border-bottom: 1px solid var(--line); margin-bottom: 32px; }
.acct-greet .eyebrow { color: var(--accent); }
.acct-greet h1 { font-family: var(--display); font-weight: 400; font-size: clamp(40px, 4vw, 56px); letter-spacing: -0.02em; line-height: 1; margin: 10px 0 6px; }
.acct-greet h1 em { font-style: italic; color: var(--accent); }
.acct-greet .sub { color: var(--ink-3); font-size: 14px; margin: 0; }
.acct-stats { display: flex; gap: 28px; padding-bottom: 4px; }
.acct-stats .stat .k { font-family: var(--mono); font-size: 10px; color: var(--ink-3); letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 4px; }
.acct-stats .stat .v { font-family: var(--display); font-size: 28px; line-height: 1; font-weight: 400; }
.acct-stats .stat .v.accent { color: var(--accent); font-style: italic; }

/* Layout: rail vs tabs */
.acct-layout { display: grid; grid-template-columns: 240px 1fr; gap: 40px; }
.acct-layout.tabs { grid-template-columns: 1fr; gap: 24px; }
.acct-rail { position: sticky; top: 96px; align-self: start; }
.acct-rail nav { display: flex; flex-direction: column; }
.rail-link { display: flex; justify-content: space-between; align-items: center; padding: 12px 14px; font-size: 14px; color: var(--ink-2); border-radius: var(--r); cursor: pointer; transition: background .12s; gap: 10px; text-decoration: none; }
.rail-link:hover { background: var(--paper-2); }
.rail-link.active { background: var(--ink); color: #fff; font-weight: 500; }
.rail-link .num { font-family: var(--mono); font-size: 11px; opacity: 0.55; }
.rail-link.active .num { opacity: 0.7; }
.rail-section { font-family: var(--mono); font-size: 10px; color: var(--ink-4); letter-spacing: 0.1em; text-transform: uppercase; margin: 22px 0 6px; padding: 0 14px; }
.rail-signout { margin-top: 24px; padding: 14px; border-top: 1px solid var(--line); font-size: 13px; color: var(--ink-3); cursor: pointer; text-decoration: none; display: block; }
.rail-signout:hover { color: var(--accent); }

/* Top tabs layout */
.acct-tabs { display: flex; gap: 4px; padding: 4px; background: var(--paper-2); border: 1px solid var(--line); border-radius: 999px; width: fit-content; }
.acct-tabs button, .acct-tabs a { padding: 10px 18px; font-size: 13px; font-weight: 500; color: var(--ink-3); border-radius: 999px; transition: all .15s; text-decoration: none; }
.acct-tabs button.active, .acct-tabs a.active { background: var(--ink); color: #fff; }
.acct-tabs button:hover:not(.active), .acct-tabs a:hover:not(.active) { color: var(--ink); }

/* Pane */
.acct-pane { display: none; }
.acct-pane.active { display: block; }
.gp-acct-rail .acct-tabs { display: none; }
.gp-acct-tabs .acct-rail { display: none; }
body.gp-acct-tabs .acct-layout { grid-template-columns: 1fr; gap: 24px; }

/* Section headers within panes */
.pane-h { display: flex; justify-content: space-between; align-items: end; margin-bottom: 20px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.pane-h h2 { font-family: var(--display); font-weight: 400; font-size: 32px; letter-spacing: -0.015em; margin: 0; }
.pane-h h2 em { font-style: italic; color: var(--accent); }
.pane-h .sub { font-size: 13px; color: var(--ink-3); margin: 4px 0 0; }
.pane-h .right { display: flex; gap: 8px; align-items: center; }

/* Dashboard A — overview cards grid */
.dash-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 20px; margin-bottom: 24px; }
.dash-grid.stack { grid-template-columns: 1fr 1fr 1fr; }
.card { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 24px; }
.card h3 { font-family: var(--display); font-weight: 400; font-size: 22px; letter-spacing: -0.01em; margin: 0 0 4px; display: flex; justify-content: space-between; align-items: end; gap: 12px; }
.card h3 em { font-style: italic; color: var(--accent); font-size: 0.85em; }
.card .card-sub { font-size: 12px; color: var(--ink-3); margin: 0 0 16px; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.card .all-link { font-size: 12px; color: var(--accent); font-weight: 500; text-decoration: none; }

/* Last order (big) */
.last-order { display: grid; grid-template-columns: 80px 1fr auto; gap: 20px; align-items: center; padding-bottom: 18px; border-bottom: 1px dashed var(--line); }
.last-order .v { width: 64px; height: 130px; }
.last-order .v svg { width: 100%; height: 100%; }
.last-order .meta-mono { font-family: var(--mono); font-size: 11px; color: var(--ink-3); letter-spacing: 0.04em; }
.last-order .name { font-size: 18px; font-weight: 600; line-height: 1.2; margin: 6px 0 4px; }
.last-order .lot { font-family: var(--mono); font-size: 11px; color: var(--ink-3); }
.last-order .status-chip { font-family: var(--mono); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; padding: 4px 10px; border-radius: 999px; background: #f1faf3; color: var(--ok); border: 1px solid #c4dfcc; font-weight: 600; }
.tracking-bar { margin-top: 18px; }
.tracking-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; position: relative; padding-top: 14px; }
.tracking-steps::before { content: ''; position: absolute; top: 23px; left: 0; right: 0; height: 1px; background: var(--line); z-index: 0; }
.tstep { position: relative; z-index: 1; text-align: center; }
.tstep .dot { width: 18px; height: 18px; border-radius: 999px; background: #fff; border: 1.5px solid var(--line-2); margin: 0 auto 8px; }
.tstep.done .dot { background: var(--ink); border-color: var(--ink); }
.tstep.done .dot::after { content: '\2713'; color: #fff; font-size: 9px; line-height: 18px; display: block; }
.tstep.current .dot { border-color: var(--accent); background: var(--accent); }
.tstep .lbl { font-family: var(--mono); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-3); }
.tstep.done .lbl, .tstep.current .lbl { color: var(--ink); }
.tstep .t { font-family: var(--mono); font-size: 10px; color: var(--ink-4); margin-top: 2px; }

/* Stat tiles */
.stat-tile { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 22px; }
.stat-tile .k { font-family: var(--mono); font-size: 10px; color: var(--ink-3); letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 14px; display: flex; justify-content: space-between; align-items: center; }
.stat-tile .v { font-family: var(--display); font-size: 44px; font-weight: 400; line-height: 1; letter-spacing: -0.015em; }
.stat-tile .v em { font-style: italic; color: var(--accent); }
.stat-tile .delta { font-size: 12px; color: var(--ink-3); margin-top: 8px; }
.stat-tile .delta strong { color: var(--ink); font-weight: 500; }

/* Credit card */
.credit-card { background: var(--ink); color: #fff; border-radius: var(--r-lg); padding: 24px; position: relative; overflow: hidden; }
.credit-card::before { content: ''; position: absolute; right: -40px; top: -40px; width: 160px; height: 160px; border: 1px solid rgba(255,255,255,0.1); border-radius: 999px; }
.credit-card::after { content: ''; position: absolute; right: -100px; top: -100px; width: 240px; height: 240px; border: 1px solid rgba(255,255,255,0.06); border-radius: 999px; }
.credit-card .k { font-family: var(--mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,0.6); margin-bottom: 10px; }
.credit-card .v { font-family: var(--display); font-size: 48px; line-height: 1; font-weight: 400; letter-spacing: -0.02em; }
.credit-card .v em { font-style: italic; color: #d6c8eb; }
.credit-card .meta { font-family: var(--mono); font-size: 11px; color: rgba(255,255,255,0.55); margin-top: 14px; }
.credit-card .actions { display: flex; gap: 8px; margin-top: 22px; position: relative; z-index: 1; }
.credit-card .btn { padding: 8px 14px; font-size: 12px; }
.credit-card .btn-line { background: transparent; border: 1px solid rgba(255,255,255,0.2); color: #fff; }
.credit-card .btn-line:hover { border-color: #fff; }

/* Orders table */
/* Wrapper provides horizontal scroll fallback before mobile card layout kicks in. */
.tbl-wrap { width: 100%; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: var(--r-lg); }
.tbl { width: 100%; border-collapse: separate; border-spacing: 0; background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; }
.tbl th { font-family: var(--mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-3); text-align: left; padding: 14px 18px; background: var(--paper-2); border-bottom: 1px solid var(--line); font-weight: 600; white-space: nowrap; }
.tbl td { padding: 16px 18px; border-bottom: 1px solid var(--line); font-size: 13px; vertical-align: middle; }
.tbl tr:last-child td { border-bottom: 0; }
.tbl tr:hover td { background: var(--paper-2); }
.tbl .num { font-family: var(--mono); font-size: 12px; color: var(--ink-2); }
.tbl .total { font-family: var(--display); font-size: 17px; color: var(--ink); }
.tbl .items { color: var(--ink-3); max-width: 280px; }
.tbl .row-cta { color: var(--accent); font-weight: 600; font-size: 12px; text-decoration: none; font-family: var(--mono); letter-spacing: 0.04em; text-transform: uppercase; }
.tbl .row-cta:hover { text-decoration: underline; }
.tbl .row-cta-cell { text-align: right; white-space: nowrap; }

/* Orders table — extra polish */
.gp-orders-tbl .tbl tbody tr { transition: background .12s; cursor: default; }
.gp-orders-tbl .tbl .chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; font-family: var(--mono); font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; font-weight: 600; line-height: 1; }
.gp-orders-tbl .tbl .chip.ok          { background: rgba(46,140,71,0.10); color: #2e8c47; }
.gp-orders-tbl .tbl .chip.processing  { background: var(--accent-tint); color: var(--accent); }
.gp-orders-tbl .tbl .chip.transit     { background: rgba(91,58,138,0.12); color: var(--accent); }

/* Mobile: convert each row into a stacked card that always fits the viewport */
@media (max-width: 640px) {
	/* Wrapper: no scroll, no overflow */
	.gp-orders-tbl.tbl-wrap { overflow-x: visible; border-radius: 0; max-width: 100%; }

	/* Reset table structure entirely — every element becomes a block */
	.gp-orders-tbl .tbl { display: block; width: 100%; max-width: 100%; border: 0; background: transparent; border-radius: 0; }
	.gp-orders-tbl .tbl thead { display: none; }
	.gp-orders-tbl .tbl tbody { display: flex; flex-direction: column; gap: 12px; width: 100%; }
	.gp-orders-tbl .tbl tr {
		display: flex;
		flex-direction: column;
		width: 100%;
		max-width: 100%;
		min-width: 0;
		box-sizing: border-box;
		background: #fff;
		border: 1px solid var(--line);
		border-radius: var(--r-lg);
		padding: 16px;
		gap: 10px;
	}
	.gp-orders-tbl .tbl tr:hover td { background: transparent; }

	/* Each cell: full-width row with mono label on left, value on right */
	.gp-orders-tbl .tbl td {
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 12px;
		width: 100%;
		max-width: 100%;
		min-width: 0;
		box-sizing: border-box;
		border: 0;
		padding: 0;
		font-size: 14px;
		text-align: right;
		word-break: break-word;
	}
	.gp-orders-tbl .tbl td::before {
		content: attr(data-label);
		flex: 0 0 auto;
		font-family: var(--mono);
		font-size: 9px;
		color: var(--ink-3);
		letter-spacing: 0.1em;
		text-transform: uppercase;
		font-weight: 600;
	}

	/* Order # — spotlight at top of card, mono+bold, separator below */
	.gp-orders-tbl .tbl td:nth-child(2) {
		order: -1;
		padding-bottom: 12px;
		border-bottom: 1px solid var(--line);
		margin-bottom: 2px;
		font-family: var(--mono);
		font-size: 15px;
		color: var(--ink);
		font-weight: 600;
	}

	/* Items can wrap on its own line below the label if long */
	.gp-orders-tbl .tbl .items {
		max-width: none;
		flex-wrap: wrap;
		justify-content: space-between;
		color: var(--ink-2);
	}

	.gp-orders-tbl .tbl .total {
		font-family: var(--display);
		font-size: 20px;
		color: var(--ink);
	}

	/* View button row — centered/right aligned full-width pill */
	.gp-orders-tbl .tbl .row-cta-cell {
		justify-content: flex-end;
		padding-top: 12px;
		margin-top: 2px;
		border-top: 1px solid var(--line);
	}
	.gp-orders-tbl .tbl .row-cta-cell::before { display: none; }
	.gp-orders-tbl .tbl .row-cta {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		padding: 9px 16px;
		border-radius: 999px;
		background: var(--ink);
		color: #fff;
		text-decoration: none;
		font-family: var(--mono);
		font-size: 11px;
		letter-spacing: 0.06em;
		text-transform: uppercase;
		font-weight: 600;
	}
	.gp-orders-tbl .tbl .row-cta:hover { background: var(--accent); text-decoration: none; color: #fff; }
}

/* Density */
.density-comfy .tbl td { padding: 22px 18px; }
.density-comfy .rail-link { padding: 14px 14px; }
.density-comfy .card { padding: 32px; }

/* Status chips */
.chip { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px; border-radius: 999px; font-family: var(--mono); font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; font-weight: 600; border: 1px solid; }
.chip.ok { background: #f1faf3; color: var(--ok); border-color: #c4dfcc; }
.chip.transit { background: #fff8ec; color: var(--warn); border-color: #efd8b1; }
.chip.processing { background: var(--accent-tint); color: var(--accent); border-color: #d6c8eb; }
.chip::before { content: '\25CF'; font-size: 8px; }

/* COA list rows */
.coa-row { display: grid; grid-template-columns: 50px 1fr 1fr 0.7fr 0.7fr auto; gap: 18px; align-items: center; padding: 14px 18px; border-bottom: 1px solid var(--line); }
.coa-row:last-child { border-bottom: 0; }
.coa-row:hover { background: var(--paper-2); }
.coa-row .v { width: 36px; height: 36px; }
.coa-row .v svg { width: 100%; height: 100%; }

/* Address / payment grids */
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.addr-card { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 22px; position: relative; }
.addr-card.default { border-color: var(--ink); }
.addr-card .default-badge { position: absolute; top: 14px; right: 14px; font-family: var(--mono); font-size: 9px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink); background: var(--paper-2); border: 1px solid var(--line); padding: 3px 7px; border-radius: 4px; font-weight: 600; }
.addr-card .label { font-family: var(--mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 8px; }
.addr-card .name { font-weight: 600; font-size: 15px; margin-bottom: 4px; }
.addr-card .lines { font-size: 13px; color: var(--ink-2); line-height: 1.65; }
.addr-card .actions { margin-top: 14px; padding-top: 14px; border-top: 1px dashed var(--line); display: flex; gap: 14px; font-size: 12px; }
.addr-card .actions a { color: var(--ink-3); text-decoration: none; }
.addr-card .actions a:hover { color: var(--accent); }
.addr-card.add { border: 1px dashed var(--line-2); display: flex; align-items: center; justify-content: center; min-height: 180px; cursor: pointer; color: var(--ink-3); font-size: 14px; transition: all .15s; text-decoration: none; }
.addr-card.add:hover { border-color: var(--ink); color: var(--ink); }
.addr-card.add .plus { font-size: 28px; font-family: var(--display); margin-bottom: 4px; text-align: center; }
.addr-card.add > div { text-align: center; }

/* Payment card */
.pay-card { display: flex; gap: 18px; align-items: center; }
.pay-card .brand { width: 48px; height: 32px; background: var(--ink); color: #fff; border-radius: 4px; display: flex; align-items: center; justify-content: center; font-family: var(--mono); font-size: 10px; letter-spacing: 0.04em; font-weight: 600; }
.pay-card .brand.visa { background: #1a1f71; }
.pay-card .brand.mc { background: #eb001b; }
.pay-card .num { font-family: var(--mono); font-size: 14px; font-weight: 500; }
.pay-card .exp { font-family: var(--mono); font-size: 11px; color: var(--ink-3); margin-top: 2px; }

/* Account details form */
.form-section { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 28px; margin-bottom: 16px; }
.form-section h3 { font-family: var(--display); font-weight: 400; font-size: 22px; letter-spacing: -0.01em; margin: 0 0 4px; }
.form-section .sub { font-size: 13px; color: var(--ink-3); margin: 0 0 22px; padding-bottom: 22px; border-bottom: 1px solid var(--line); }
.form-section .form-row { display: grid; grid-template-columns: 200px 1fr auto; gap: 24px; align-items: center; padding: 14px 0; border-bottom: 1px dashed var(--line); }
.form-section .form-row:last-child { border-bottom: 0; }
.form-section .form-row .lbl { font-family: var(--mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-3); }
.form-section .form-row .val { font-size: 14px; font-weight: 500; }
.form-section .form-row .val .pwd { font-family: var(--mono); letter-spacing: 0.2em; }
.form-section .form-row .val .verify { font-family: var(--mono); font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ok); margin-left: 8px; padding: 2px 8px; border: 1px solid #c4dfcc; background: #f1faf3; border-radius: 999px; font-weight: 600; }
.form-section .form-row .edit { font-size: 12px; color: var(--accent); font-weight: 500; text-decoration: none; }
.toggle { width: 38px; height: 22px; background: var(--line-2); border-radius: 999px; position: relative; cursor: pointer; transition: background .15s; flex-shrink: 0; border: 0; padding: 0; }
.toggle.on { background: var(--accent); }
.toggle::after { content: ''; position: absolute; top: 2px; left: 2px; width: 18px; height: 18px; background: #fff; border-radius: 999px; transition: transform .15s; }
.toggle.on::after { transform: translateX(16px); }

/* Recent COAs mini-list inside dashboard */
.mini-coa-row { display: flex; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px dashed var(--line); }
.mini-coa-row:last-child { border-bottom: 0; padding-bottom: 0; }
.mini-coa-row .v { width: 28px; height: 28px; flex-shrink: 0; }
.mini-coa-row .v svg { width: 100%; height: 100%; }
.mini-coa-row .info { flex: 1; min-width: 0; }
.mini-coa-row .name { font-size: 13px; font-weight: 500; }
.mini-coa-row .lot { font-family: var(--mono); font-size: 10px; color: var(--ink-3); }
.mini-coa-row .pur { font-family: var(--display); font-size: 16px; }
.mini-coa-row .dl { font-size: 11px; color: var(--accent); font-weight: 500; text-decoration: none; }

/* Activity feed */
.act-feed { display: flex; flex-direction: column; }
.act-row { display: grid; grid-template-columns: 24px 1fr auto; gap: 14px; padding: 12px 0; border-bottom: 1px dashed var(--line); align-items: start; }
.act-row:last-child { border-bottom: 0; }
.act-row .ico { width: 24px; height: 24px; border: 1px solid var(--line-2); border-radius: 999px; display: flex; align-items: center; justify-content: center; font-family: var(--display); font-size: 12px; font-style: italic; color: var(--ink-2); }
.act-row .body { font-size: 13px; line-height: 1.5; }
.act-row .body strong { font-weight: 600; }
.act-row .time { font-family: var(--mono); font-size: 10px; color: var(--ink-3); white-space: nowrap; }

/* Btn additions */
.btn-line.dark { border-color: var(--ink); }

/* WooCommerce native My Account forms — styled to match the rest of the design. */

/* Sidebar navigation — identical look to the dashboard .acct-rail. */
.woocommerce-MyAccount-navigation { position: sticky; top: 96px; align-self: start; }
.woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; }
.woocommerce-MyAccount-navigation li { display: block; margin: 0; }
.woocommerce-MyAccount-navigation li a {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 12px 14px;
	font-size: 14px;
	color: var(--ink-2);
	border-radius: var(--r);
	text-decoration: none;
	transition: background .12s;
	gap: 10px;
}
.woocommerce-MyAccount-navigation li a:hover { background: var(--paper-2); color: var(--ink); }
.woocommerce-MyAccount-navigation li.is-active a { background: var(--ink); color: #fff; font-weight: 500; }
.woocommerce-MyAccount-navigation li a .num {
	font-family: var(--mono);
	font-size: 11px;
	opacity: 0.55;
}
.woocommerce-MyAccount-navigation li.is-active a .num { opacity: 0.7; }
.woocommerce-MyAccount-navigation .rail-section {
	font-family: var(--mono);
	font-size: 10px;
	color: var(--ink-4);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	margin: 22px 0 6px;
	padding: 0 14px;
}
.woocommerce-MyAccount-navigation .rail-link {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 12px 14px;
	font-size: 14px;
	color: var(--ink-2);
	border-radius: var(--r);
	text-decoration: none;
	transition: background .12s;
}
.woocommerce-MyAccount-navigation .rail-link:hover { background: var(--paper-2); color: var(--ink); }
.woocommerce-MyAccount-navigation .rail-signout {
	display: block;
	margin-top: 24px;
	padding: 14px;
	border-top: 1px solid var(--line);
	font-size: 13px;
	color: var(--ink-3);
	text-decoration: none;
}
.woocommerce-MyAccount-navigation .rail-signout:hover { color: var(--accent); }
.density-comfy .woocommerce-MyAccount-navigation li a { padding: 14px; }

/* Content wrapper — give WC's content the same card chrome the rest of the design uses. */
.woocommerce-MyAccount-content { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 36px; }
.woocommerce-MyAccount-content > h2,
.woocommerce-MyAccount-content > h3,
.woocommerce-MyAccount-content > form > h3 { font-family: var(--display); font-weight: 400; font-size: 28px; letter-spacing: -0.015em; margin: 0 0 20px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.woocommerce-MyAccount-content > p { font-size: 14px; color: var(--ink-3); line-height: 1.6; margin: 0 0 18px; }
.woocommerce-MyAccount-content > p:has(.woocommerce-Button), .woocommerce-MyAccount-content fieldset + p { margin-top: 24px; }

/* Form rows — overrides for WooCommerce's .form-row classes (scoped to WC content). */
.woocommerce-MyAccount-content .woocommerce-EditAccountForm,
.woocommerce-MyAccount-content .woocommerce-address-fields { display: block; }
.woocommerce-MyAccount-content .woocommerce-address-fields__field-wrapper,
.woocommerce-MyAccount-content .woocommerce-EditAccountForm > p:not(:has(button)),
.woocommerce-MyAccount-content fieldset { margin: 0 0 4px; }
.woocommerce-MyAccount-content fieldset { border: 1px solid var(--line); border-radius: var(--r); padding: 20px 22px; margin-top: 20px; }
.woocommerce-MyAccount-content fieldset legend { font-family: var(--mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-3); padding: 0 8px; }

.woocommerce-MyAccount-content p.form-row {
	display: block;
	padding: 12px 0;
	margin: 0;
	border: 0;
	border-bottom: 1px dashed var(--line);
}
.woocommerce-MyAccount-content p.form-row:last-child { border-bottom: 0; }
.woocommerce-MyAccount-content p.form-row.form-row-first,
.woocommerce-MyAccount-content p.form-row.form-row-last { display: inline-block; width: calc(50% - 8px); vertical-align: top; }
.woocommerce-MyAccount-content p.form-row.form-row-first { margin-right: 12px; }
.woocommerce-MyAccount-content p.form-row.form-row-wide { width: 100%; }

.woocommerce-MyAccount-content label,
.woocommerce-MyAccount-content .woocommerce-form__label {
	display: block;
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ink-3);
	margin: 0 0 6px;
	font-weight: 500;
}
.woocommerce-MyAccount-content label .required { color: var(--accent); margin-left: 2px; }

.woocommerce-MyAccount-content input[type=text],
.woocommerce-MyAccount-content input[type=email],
.woocommerce-MyAccount-content input[type=password],
.woocommerce-MyAccount-content input[type=tel],
.woocommerce-MyAccount-content input[type=number],
.woocommerce-MyAccount-content select,
.woocommerce-MyAccount-content textarea,
.woocommerce-MyAccount-content .select2-selection--single {
	width: 100% !important;
	padding: 12px 14px !important;
	border: 1px solid var(--line-2) !important;
	border-radius: var(--r) !important;
	font-family: var(--sans);
	font-size: 14px;
	background: #fff;
	color: var(--ink);
	outline: none;
	transition: border-color .15s, box-shadow .15s;
	height: auto !important;
	box-sizing: border-box;
}
.woocommerce-MyAccount-content input:focus,
.woocommerce-MyAccount-content select:focus,
.woocommerce-MyAccount-content textarea:focus,
.woocommerce-MyAccount-content .select2-selection--single:focus {
	border-color: var(--accent) !important;
	box-shadow: 0 0 0 3px var(--accent-tint) !important;
}
.woocommerce-MyAccount-content .select2-selection__rendered { padding: 0 !important; line-height: 1.4 !important; color: var(--ink) !important; }
.woocommerce-MyAccount-content .select2-selection__arrow { height: 100% !important; right: 8px !important; }

.woocommerce-MyAccount-content .woocommerce-input-wrapper { display: block; width: 100%; }

/* Submit button — pill style, matches site buttons. */
.woocommerce-MyAccount-content button[type=submit],
.woocommerce-MyAccount-content .woocommerce-Button,
.woocommerce-MyAccount-content .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 12px 22px;
	border-radius: 999px;
	font-size: 14px;
	font-weight: 500;
	background: var(--ink);
	color: #fff;
	border: 0;
	cursor: pointer;
	text-decoration: none;
	transition: background .15s;
}
.woocommerce-MyAccount-content button[type=submit]:hover,
.woocommerce-MyAccount-content .woocommerce-Button:hover,
.woocommerce-MyAccount-content .button:hover { background: var(--accent); color: #fff; }

/* Tables (orders / downloads) */
.woocommerce-MyAccount-content table.shop_table,
.woocommerce-MyAccount-content table { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; }
.woocommerce-MyAccount-content table th { font-family: var(--mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-3); text-align: left; padding: 14px 18px; background: var(--paper-2); border-bottom: 1px solid var(--line); font-weight: 500; }
.woocommerce-MyAccount-content table td { padding: 16px 18px; border-bottom: 1px solid var(--line); font-size: 13px; vertical-align: middle; }
.woocommerce-MyAccount-content table tr:last-child td { border-bottom: 0; }

/* Address summary blocks (the two cards on /my-account/edit-address/) */
.u-columns.woocommerce-Addresses,
.woocommerce-Addresses { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.u-columns.woocommerce-Addresses .woocommerce-Address,
.woocommerce-Addresses .woocommerce-Address { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 24px; }
.woocommerce-Address-title { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.woocommerce-Address-title h2,
.woocommerce-Address-title h3 { font-family: var(--display); font-weight: 400; font-size: 22px; letter-spacing: -0.01em; margin: 0; padding: 0; border: 0; }
.woocommerce-Address-title .edit { font-size: 12px; color: var(--accent); font-weight: 500; text-decoration: none; }
.woocommerce-Address address { font-style: normal; font-size: 13px; color: var(--ink-2); line-height: 1.7; }

/* Notices */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	background: var(--paper-2);
	border: 1px solid var(--line);
	border-left: 3px solid var(--accent);
	padding: 14px 18px;
	border-radius: var(--r);
	font-size: 14px;
	margin: 0 0 18px;
	list-style: none;
}
.woocommerce-message { border-left-color: var(--ok); }
.woocommerce-error { border-left-color: #b22222; }
.woocommerce-message li, .woocommerce-error li { margin: 0; }

/* ─────────────────────────────────────────────
   Auth screen — split-screen branded layout.
   Left: dark accent panel with logo / quote / stats.
   Right: clean form card on paper background.
   ───────────────────────────────────────────── */
body.gp-auth-page { background: var(--paper); min-height: 100vh; }
body.gp-auth-page .site-header,
body.gp-auth-page header#site-header,
body.gp-auth-page .gp-utility-bar,
body.gp-auth-page .gp-header,
body.gp-auth-page .gp-footer,
body.gp-auth-page .footer,
body.gp-auth-page footer.site-footer { display: none !important; }

/* ── Left aside (brand panel) ─────────────────── */
body.gp-auth-page .gp-auth-aside {
	position: fixed;
	left: 0; top: 0; bottom: 0;
	width: 480px;
	background: var(--ink);
	background-image:
		radial-gradient(circle at 20% 0%, rgba(91,58,138,0.35) 0%, transparent 55%),
		radial-gradient(circle at 80% 100%, rgba(91,58,138,0.25) 0%, transparent 50%),
		linear-gradient(180deg, #0b0b0c 0%, #15131c 100%);
	color: #fff;
	overflow-y: auto;
	z-index: 10;
}
body.gp-auth-page .gp-auth-aside-inner {
	padding: 48px 44px 40px;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	gap: 0;
	position: relative;
}
body.gp-auth-page .gp-auth-aside-inner::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: radial-gradient(rgba(255,255,255,0.04) 1px, transparent 1px);
	background-size: 18px 18px;
	pointer-events: none;
	mask-image: linear-gradient(180deg, transparent, #000 30%, #000 70%, transparent);
}
body.gp-auth-page .gp-auth-brand {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	color: #fff;
	margin-bottom: 24px;
	z-index: 2;
}
body.gp-auth-page .gp-auth-brand img { max-height: 44px; width: auto; filter: brightness(0) invert(1); }
body.gp-auth-page .gp-auth-brand-text {
	font-family: var(--display);
	font-size: 22px;
	letter-spacing: -0.015em;
	color: #fff;
}
body.gp-auth-page .gp-auth-status {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 12px;
	border-radius: 999px;
	background: rgba(255,255,255,0.06);
	border: 1px solid rgba(255,255,255,0.12);
	width: max-content;
	margin-bottom: 36px;
	z-index: 2;
}
body.gp-auth-page .gp-auth-status .dot {
	width: 6px; height: 6px;
	border-radius: 999px;
	background: #4ade80;
	box-shadow: 0 0 0 0 rgba(74,222,128,0.6);
	animation: gp-auth-pulse 2.4s infinite;
}
body.gp-auth-page .gp-auth-status .mono {
	font-family: var(--mono);
	font-size: 10px;
	letter-spacing: 0.12em;
	color: rgba(255,255,255,0.85);
	text-transform: uppercase;
}
@keyframes gp-auth-pulse {
	0%,100% { box-shadow: 0 0 0 0 rgba(74,222,128,0.6); }
	50%     { box-shadow: 0 0 0 8px rgba(74,222,128,0);   }
}

body.gp-auth-page .gp-auth-hero { z-index: 2; margin-bottom: auto; }
body.gp-auth-page .gp-auth-eyebrow {
	font-family: var(--mono);
	font-size: 10px;
	color: #c8b8e6;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	margin-bottom: 18px;
}
body.gp-auth-page .gp-auth-quote {
	font-family: var(--display);
	font-weight: 400;
	font-size: clamp(36px, 4vw, 52px);
	line-height: 1.05;
	letter-spacing: -0.025em;
	margin: 0 0 18px;
	color: #fff;
}
body.gp-auth-page .gp-auth-quote em {
	font-style: italic;
	color: #c8b8e6;
}
body.gp-auth-page .gp-auth-lede {
	font-size: 14px;
	line-height: 1.65;
	color: rgba(255,255,255,0.7);
	margin: 0 0 36px;
	max-width: 360px;
}

body.gp-auth-page .gp-auth-stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 14px;
	padding: 22px 0;
	border-top: 1px solid rgba(255,255,255,0.08);
	border-bottom: 1px solid rgba(255,255,255,0.08);
	z-index: 2;
}
body.gp-auth-page .gp-auth-stat .v {
	font-family: var(--display);
	font-size: 26px;
	font-weight: 400;
	letter-spacing: -0.02em;
	color: #fff;
	line-height: 1;
}
body.gp-auth-page .gp-auth-stat .v span {
	font-size: 14px;
	color: #c8b8e6;
	font-style: italic;
	margin-left: 1px;
}
body.gp-auth-page .gp-auth-stat .k {
	font-family: var(--mono);
	font-size: 9px;
	color: rgba(255,255,255,0.55);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	margin-top: 6px;
}

body.gp-auth-page .gp-auth-foot-strip {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 22px;
	z-index: 2;
}
body.gp-auth-page .gp-auth-foot-strip .chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 10px;
	border-radius: 999px;
	background: rgba(255,255,255,0.05);
	border: 1px solid rgba(255,255,255,0.1);
	font-family: var(--mono);
	font-size: 10px;
	color: rgba(255,255,255,0.78);
	letter-spacing: 0.04em;
}
body.gp-auth-page .gp-auth-foot-strip .chip svg { color: #4ade80; }

body.gp-auth-page .gp-auth-disclaimer {
	margin-top: 22px;
	padding-top: 18px;
	border-top: 1px solid rgba(255,255,255,0.08);
	font-family: var(--mono);
	font-size: 10px;
	color: rgba(255,255,255,0.45);
	letter-spacing: 0.06em;
	line-height: 1.5;
	z-index: 2;
}

/* ── Right (form column) ─────────────────────── */
body.gp-auth-page { position: relative; }
body.gp-auth-page #content,
body.gp-auth-page .site-main,
body.gp-auth-page main.site-main,
body.gp-auth-page .page-content,
body.gp-auth-page .elementor-section-wrap,
body.gp-auth-page main,
body.gp-auth-page article,
body.gp-auth-page .entry-content,
body.gp-auth-page .site,
body.gp-auth-page .container {
	max-width: none !important;
	width: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	display: block !important;
}
body.gp-auth-page .gp-auth-shell,
body.gp-auth-page .gp-forgot-page {
	position: absolute;
	left: 480px;
	right: 0;
	top: 0;
	bottom: auto;
	min-height: 100vh;
	max-width: none;
	width: auto;
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 48px 24px;
	background: var(--paper);
	box-sizing: border-box;
	z-index: 1;
}
body.gp-auth-page .gp-auth-shell > .gp-auth-card,
body.gp-auth-page .gp-forgot-page > .gp-forgot-shell { width: 100%; max-width: 460px; margin: 0; }
body.gp-auth-page .gp-auth-card,
body.gp-auth-page .gp-forgot-card {
	box-shadow: 0 1px 0 rgba(11,11,12,0.04), 0 24px 60px -20px rgba(11,11,12,0.18);
	position: relative;
	overflow: hidden;
}
body.gp-auth-page .gp-auth-card::before,
body.gp-auth-page .gp-forgot-card::before {
	content: "";
	position: absolute;
	left: 0; right: 0; top: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--accent) 0%, #c8b8e6 100%);
}

/* ── Mobile: stack ─────────────────────────────── */
@media (max-width: 1024px) {
	body.gp-auth-page .gp-auth-aside {
		position: static;
		width: 100%;
		min-height: auto;
	}
	body.gp-auth-page .gp-auth-aside-inner {
		padding: 36px 28px 28px;
		min-height: auto;
	}
	body.gp-auth-page .gp-auth-quote { font-size: 30px; }
	body.gp-auth-page .gp-auth-lede { margin-bottom: 24px; }
	body.gp-auth-page .gp-auth-shell,
	body.gp-auth-page .gp-forgot-page {
		position: static;
		left: auto;
		right: auto;
		top: auto;
		width: 100%;
		padding: 32px 16px 48px;
		min-height: auto;
	}
}
@media (max-width: 560px) {
	body.gp-auth-page .gp-auth-aside-inner { padding: 28px 20px 24px; }
	body.gp-auth-page .gp-auth-quote { font-size: 26px; }
	body.gp-auth-page .gp-auth-stats { grid-template-columns: 1fr 1fr; }
	body.gp-auth-page .gp-auth-stats .gp-auth-stat:last-child { grid-column: 1 / -1; }
}

/* ── Original auth-shell (form card) baseline ── */
.gp-auth-shell { max-width: 460px; margin: 64px auto; padding: 0 24px; }
.gp-auth-card { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 36px; }
.gp-auth-tabs { display: flex; gap: 4px; padding: 4px; background: var(--paper-2); border: 1px solid var(--line); border-radius: 999px; margin: 0 0 24px; }
.gp-auth-tabs a { flex: 1; text-align: center; padding: 10px 18px; font-size: 13px; font-weight: 500; color: var(--ink-3); border-radius: 999px; text-decoration: none; transition: all .15s; }
.gp-auth-tabs a.active { background: var(--ink); color: #fff; }
.gp-auth-tabs a:not(.active):hover { color: var(--ink); }
.gp-auth-card h2 { font-family: var(--display); font-weight: 400; font-size: 32px; letter-spacing: -0.015em; margin: 0 0 6px; padding: 0; border: 0; }
.gp-auth-sub { font-size: 14px; color: var(--ink-3); margin: 0 0 28px; }
.gp-auth-card .form-row { padding: 0; margin: 0 0 14px; border: 0; }
.gp-auth-row { display: flex; justify-content: space-between; align-items: center; padding: 4px 0 18px; }
.gp-auth-row .woocommerce-form__label-for-checkbox { font-family: var(--sans); font-size: 13px; color: var(--ink-2); text-transform: none; letter-spacing: 0; margin: 0; display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.gp-auth-forgot { font-size: 13px; color: var(--accent); text-decoration: none; }
.gp-auth-forgot:hover { text-decoration: underline; }
.gp-auth-foot { margin: 22px 0 0; padding-top: 22px; border-top: 1px solid var(--line); font-size: 13px; color: var(--ink-3); text-align: center; }
.gp-auth-foot a { color: var(--accent); text-decoration: none; font-weight: 500; }
.gp-auth-foot a:hover { text-decoration: underline; }
.gp-auth-card .btn-block { width: 100%; }

@media (max-width: 760px) {
	.u-columns.woocommerce-Addresses, .woocommerce-Addresses { grid-template-columns: 1fr; }
	.woocommerce-MyAccount-content p.form-row.form-row-first,
	.woocommerce-MyAccount-content p.form-row.form-row-last { width: 100%; margin-right: 0; display: block; }
}

@media (max-width: 880px) {
  .acct-layout { grid-template-columns: 1fr; }
  .dash-grid, .dash-grid.stack { grid-template-columns: 1fr; }
  .grid-2 { grid-template-columns: 1fr; }
  .acct-greet { flex-direction: column; align-items: flex-start; }
  .form-row { grid-template-columns: 1fr; }
  /* Prevent any wide child (table, code block, etc.) from forcing the column wider than the viewport */
  .acct-shell, .acct-layout, .acct-content, .acct-pane, .acct-rail { min-width: 0; max-width: 100%; }
}
@media (max-width: 640px) {
  .acct-shell { padding: 24px 14px 64px; }
  .acct-content, .acct-pane { padding: 0; }
}