/* Crown Jewellery — My Account: the customer panel. Loaded on the account
   page only. Sidebar (customer card, icon menu, help) + content column with
   cards; branded login / password cards when logged out. */

.account-page {
	padding-block: 28px 96px;
}

.account-width {
	max-width: calc(1280px + 2 * var(--cj-page-padding));
}

/* Two columns: sidebar on the start side, content on the end side */
.account-page .woocommerce {
	display: grid;
	grid-template-columns: 296px minmax(0, 1fr);
	gap: 36px;
	align-items: start;
}

.account-page .woocommerce > .woocommerce-notices-wrapper {
	grid-column: 1 / -1;
	margin: 0;
}

/* WooCommerce's clearfix pseudo-elements would become grid items */
.account-page .woocommerce::before,
.account-page .woocommerce::after {
	content: none;
	display: none;
}

.account-page .woocommerce > .woocommerce-notices-wrapper:empty {
	display: none;
}

.account-page--auth .woocommerce {
	display: block;
}

/* Notices */
.account-page .woocommerce-message,
.account-page .woocommerce-error,
.account-page .woocommerce-info {
	margin: 0 0 20px;
	padding: 16px 20px;
	border: 1px solid var(--cj-border);
	border-radius: var(--cj-radius-panel);
	background: var(--cj-surface);
	list-style: none;
	font-size: 14px;
	line-height: 1.5;
}

.account-page .woocommerce-error {
	border-color: rgba(179, 38, 30, 0.25);
	background: #fdf3f2;
	color: var(--cj-error);
}

.account-page .woocommerce-message {
	border-color: rgba(46, 125, 50, 0.25);
	background: #f1f8f2;
}

.account-page .woocommerce-error li,
.account-page .woocommerce-message li,
.account-page .woocommerce-info li {
	margin: 0;
}

.account-page .woocommerce-message .button,
.account-page .woocommerce-info .button {
	padding: 10px 16px;
	margin-inline-start: 12px;
	font-size: 13px;
}

/* -------------------------------------------------------------------------
   Sidebar
   ------------------------------------------------------------------------- */
.account-sidebar {
	position: sticky;
	top: calc(var(--cj-header-compact) + 20px);
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.account-user {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 20px;
	border-radius: var(--cj-radius-card);
	background: var(--cj-black);
	color: var(--cj-white);
}

.account-avatar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 52px;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: var(--cj-highlight);
	color: var(--cj-black);
	font-size: 18px;
	font-weight: 600;
	letter-spacing: 0.02em;
}

.account-user-text {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}

.account-user-text strong {
	font-size: 16px;
	font-weight: 500;
	line-height: 1.2;
}

.account-user-text span {
	overflow: hidden;
	font-size: 13px;
	color: rgba(255, 255, 255, 0.68);
	text-overflow: ellipsis;
	white-space: nowrap;
}

.account-user-text small {
	font-size: 12px;
	color: rgba(255, 255, 255, 0.5);
}

.woocommerce-MyAccount-navigation {
	float: none;
	width: auto;
	padding: 8px;
	border: 1px solid var(--cj-border);
	border-radius: var(--cj-radius-card);
	background: var(--cj-white);
}

.woocommerce-MyAccount-navigation ul {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.woocommerce-MyAccount-navigation li {
	margin: 0;
}

.account-page .woocommerce-MyAccount-navigation ul li a {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 14px;
	border-radius: 12px;
	color: var(--cj-black);
	font-size: 15px;
	font-weight: 500;
	text-decoration: none;
	transition: background var(--cj-transition), color var(--cj-transition);
}

.account-page .woocommerce-MyAccount-navigation ul li a::before {
	content: '';
	display: block;
	flex: 0 0 20px;
	width: 20px;
	height: 20px;
	background-color: currentColor;
	-webkit-mask: var(--account-icon) center / contain no-repeat;
	mask: var(--account-icon) center / contain no-repeat;
}

.account-page .woocommerce-MyAccount-navigation ul li a:hover,
.account-page .woocommerce-MyAccount-navigation ul li a:focus-visible {
	background: var(--cj-surface-2);
}

.account-page .woocommerce-MyAccount-navigation ul li.is-active a {
	background: var(--cj-black);
	color: var(--cj-white);
}

.woocommerce-MyAccount-navigation-link--customer-logout {
	margin-block-start: 6px;
	padding-block-start: 6px;
	border-block-start: 1px solid var(--cj-border-light);
}

.account-page .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--customer-logout a {
	color: var(--cj-text-muted);
}

.woocommerce-MyAccount-navigation-link--dashboard a {
	--account-icon: 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");
}

.woocommerce-MyAccount-navigation-link--orders a {
	--account-icon: 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='M5 8h14l-1 12H6L5 8Z'/%3E%3Cpath d='M9 8V6a3 3 0 0 1 6 0v2'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--downloads a {
	--account-icon: 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 4v11'/%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3Cpath d='M4 19h16'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--edit-address a {
	--account-icon: 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 21s6-5.5 6-11a6 6 0 1 0-12 0c0 5.5 6 11 6 11Z'/%3E%3Ccircle cx='12' cy='10' r='2.2'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--payment-methods a {
	--account-icon: 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='6' width='18' height='12' rx='2'/%3E%3Cpath d='M3 10h18'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--edit-account a {
	--account-icon: 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='8' r='4'/%3E%3Cpath d='M4 21a8 8 0 0 1 16 0'/%3E%3C/svg%3E");
}

.woocommerce-MyAccount-navigation-link--customer-logout a {
	--account-icon: 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='M10 4H6a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h4'/%3E%3Cpath d='m14 8 4 4-4 4'/%3E%3Cpath d='M18 12H9'/%3E%3C/svg%3E");
}

/* -------------------------------------------------------------------------
   Content column
   ------------------------------------------------------------------------- */
.woocommerce-MyAccount-content {
	float: none;
	width: auto;
	min-width: 0;
}

.account-head {
	margin: 4px 0 28px;
}

.account-crumbs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 10px;
	font-size: 13px;
	color: var(--cj-text-muted);
}

.account-crumbs a {
	color: inherit;
	text-decoration: none;
}

.account-crumbs a:hover {
	color: var(--cj-black);
}

.account-title {
	margin: 0;
	font-size: clamp(1.9rem, 1.5rem + 1.4vw, 2.6rem);
	letter-spacing: -0.02em;
}

.account-lead {
	max-width: 640px;
	margin: 10px 0 0;
	font-size: 15px;
	line-height: 1.6;
	color: var(--cj-text-muted);
}

.account-lead a {
	color: var(--cj-black);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.account-head-row {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: space-between;
	gap: 20px;
}

.account-card {
	padding: 26px 28px;
	border: 1px solid var(--cj-border);
	border-radius: var(--cj-radius-card);
	background: var(--cj-white);
}

.account-card > h2,
.account-section-head h2 {
	margin: 0 0 18px;
	font-size: 20px;
	font-weight: 500;
	letter-spacing: -0.01em;
}

.account-section {
	margin-block-start: 32px;
}

.account-section-head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	margin-block-end: 16px;
}

.account-section-head h2 {
	margin: 0;
}

/* Stats */
.account-stats {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}

.account-stat {
	padding: 20px 22px;
	border: 1px solid var(--cj-border-light);
	border-radius: var(--cj-radius-card);
	background: var(--cj-surface);
}

.account-stat-label {
	display: block;
	margin-block-end: 8px;
	font-size: 13px;
	color: var(--cj-text-muted);
}

.account-stat strong {
	display: block;
	font-size: 30px;
	font-weight: 500;
	line-height: 1;
	letter-spacing: -0.02em;
}

.account-stat--last {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
}

.account-stat--last .account-stat-label {
	margin: 0;
}

.account-stat--last time {
	font-size: 13px;
	color: var(--cj-text-muted);
}

/* Status pills */
.account-pill {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 7px 12px;
	border-radius: 999px;
	background: #efeeeb;
	color: #4b4740;
	font-size: 13px;
	font-weight: 500;
	line-height: 1;
	white-space: nowrap;
}

.account-pill::before {
	content: '';
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: currentColor;
	opacity: 0.8;
}

.account-pill--gold {
	background: #f7ecd4;
	color: #7a5717;
}

.account-pill--blue {
	background: #e6eefb;
	color: #1e4a8b;
}

.account-pill--sage {
	background: #e4f2e7;
	color: #1f6134;
}

.account-pill--rose {
	background: #fbe8e6;
	color: #9a2a21;
}

.account-pill--lg {
	padding: 11px 16px;
	font-size: 14px;
}

/* Order cards */
.order-list {
	display: grid;
	gap: 16px;
}

.order-card {
	padding: 22px 24px;
	border: 1px solid var(--cj-border);
	border-radius: var(--cj-radius-card);
	background: var(--cj-white);
	transition: border-color var(--cj-transition), box-shadow var(--cj-transition);
}

.order-card:hover {
	border-color: rgba(23, 23, 23, 0.28);
	box-shadow: 0 10px 30px rgba(23, 23, 23, 0.06);
}

.order-card-head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

.order-card-id {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.order-card-number {
	color: var(--cj-black);
	font-size: 17px;
	font-weight: 500;
	text-decoration: none;
}

.order-card-number:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.order-card-id time {
	font-size: 13px;
	color: var(--cj-text-muted);
}

.order-card-body {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-block-start: 18px;
}

.order-thumbs {
	display: flex;
}

.order-thumb {
	display: inline-flex;
	width: 56px;
	height: 56px;
	overflow: hidden;
	border: 2px solid var(--cj-white);
	border-radius: 12px;
	background: var(--cj-surface);
	box-shadow: 0 0 0 1px var(--cj-border);
}

.order-thumb + .order-thumb {
	margin-inline-start: -12px;
}

.order-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.order-thumb--more {
	align-items: center;
	justify-content: center;
	font-size: 13px;
	font-weight: 500;
	color: var(--cj-text-muted);
}

.order-card-meta {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 4px;
	text-align: end;
}

.order-card-count {
	font-size: 13px;
	color: var(--cj-text-muted);
}

.order-card-total {
	font-size: 19px;
	font-weight: 500;
}

.order-card-track {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 14px 0 0;
	font-size: 13px;
	color: var(--cj-text-muted);
}

.order-card-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-block-start: 18px;
}

.order-card-actions .btn {
	padding: 14px 20px;
	font-size: 14px;
}

/* Empty state */
.account-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	padding: 48px 24px;
	border: 1px dashed var(--cj-border);
	border-radius: var(--cj-radius-card);
	background: var(--cj-surface);
	text-align: center;
}

.account-empty-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: var(--cj-highlight);
}

.account-empty h3 {
	margin: 6px 0 0;
	font-size: 20px;
}

.account-empty p {
	margin: 0;
	color: var(--cj-text-muted);
}

.account-empty .btn {
	margin-block-start: 10px;
}

/* Quick links */
.account-tiles {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 14px;
}

.account-tile {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 20px;
	border: 1px solid var(--cj-border);
	border-radius: var(--cj-radius-card);
	background: var(--cj-white);
	color: var(--cj-black);
	text-decoration: none;
	transition: border-color var(--cj-transition), transform var(--cj-transition);
}

.account-tile:hover {
	border-color: var(--cj-black);
	transform: translateY(-2px);
}

.account-tile-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 12px;
	background: var(--cj-surface-2);
}

.account-tile strong {
	font-size: 15px;
	font-weight: 500;
}

.account-tile span:not(.account-tile-icon) {
	font-size: 13px;
	color: var(--cj-text-muted);
}

/* Help card */
.account-help {
	padding: 22px 24px;
	border: 1px solid var(--cj-border);
	border-radius: var(--cj-radius-card);
	background: var(--cj-white);
}

.account-help--full {
	margin-block-start: 32px;
	background: var(--cj-surface);
}

.order-side .account-help--full {
	margin-block-start: 0;
}

.account-help-head {
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.account-help-icon {
	flex: 0 0 22px;
	margin-block-start: 2px;
}

.account-help h3 {
	margin: 0 0 6px;
	font-size: 18px;
	font-weight: 500;
}

.account-help p {
	margin: 0;
	font-size: 14px;
	line-height: 1.55;
	color: var(--cj-text-muted);
}

.account-help-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 18px;
	margin-block-start: 16px;
}

.account-help-wa {
	padding: 14px 20px;
	font-size: 14px;
}

.account-help-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--cj-black);
	font-size: 14px;
	text-decoration: none;
}

.account-help-link:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.account-help-list {
	display: grid;
	gap: 2px;
	margin: 18px 0 0;
	padding: 14px 0 0;
	border-block-start: 1px solid var(--cj-border-light);
	list-style: none;
}

.account-help-list li {
	margin: 0;
}

.account-help-list a {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 0;
	color: var(--cj-black);
	font-size: 14px;
	text-decoration: none;
}

.account-help-list a:hover span {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.account-help-list a span {
	flex: 1;
}

.account-help-chev {
	color: var(--cj-text-muted);
}

.account-help--side .account-help-actions {
	flex-direction: column;
	align-items: stretch;
}

.account-help--side .account-help-wa {
	justify-content: center;
}

/* -------------------------------------------------------------------------
   Order page
   ------------------------------------------------------------------------- */
.order-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 340px;
	gap: 20px;
	align-items: start;
	margin-block-start: 20px;
}

.order-main,
.order-side {
	display: grid;
	gap: 20px;
	min-width: 0;
}

.order-items {
	margin: 0;
	padding: 0;
	list-style: none;
}

.order-item {
	display: grid;
	grid-template-columns: 72px minmax(0, 1fr) auto;
	gap: 16px;
	align-items: center;
	padding: 14px 0;
	border-block-end: 1px solid var(--cj-border-light);
}

.order-item:first-child {
	padding-block-start: 0;
}

.order-item-thumb {
	display: block;
	width: 72px;
	height: 72px;
	overflow: hidden;
	border-radius: 12px;
	background: var(--cj-surface);
}

.order-item-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.order-item-text {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

.order-item-text strong {
	font-size: 15px;
	font-weight: 500;
	line-height: 1.35;
}

.order-item-text a {
	color: inherit;
	text-decoration: none;
}

.order-item-text a:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.order-item-meta,
.order-item-qty {
	font-size: 13px;
	color: var(--cj-text-muted);
}

.order-item-qty em {
	font-style: normal;
}

.order-item-total {
	font-size: 15px;
	font-weight: 500;
	white-space: nowrap;
}

.order-totals {
	display: grid;
	gap: 8px;
	margin: 18px 0 0;
	padding: 18px 0 0;
	border-block-start: 1px solid var(--cj-border);
}

.order-total {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	font-size: 14px;
}

.order-total dt {
	color: var(--cj-text-muted);
}

.order-total dd {
	margin: 0;
}

.order-total--order_total {
	margin-block-start: 6px;
	padding-block-start: 12px;
	border-block-start: 1px solid var(--cj-border-light);
	font-size: 17px;
	font-weight: 500;
}

.order-total--order_total dt {
	color: var(--cj-black);
}

.order-note {
	margin: 16px 0 0;
	padding: 14px 16px;
	border-radius: 12px;
	background: var(--cj-surface);
	font-size: 14px;
	line-height: 1.5;
}

.order-note strong {
	display: block;
	margin-block-end: 4px;
	font-size: 13px;
	font-weight: 500;
	color: var(--cj-text-muted);
}

.order-items-card .order-card-actions {
	margin-block-start: 20px;
}

.account-page .order-again {
	margin: 16px 0 0;
}

.order-info h2 {
	display: flex;
	align-items: center;
	gap: 10px;
}

.order-info address {
	margin: 0;
	font-style: normal;
	font-size: 14px;
	line-height: 1.7;
}

.order-info-row {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 10px 0 0;
	margin-block-start: 10px;
	border-block-start: 1px solid var(--cj-border-light);
	font-size: 14px;
}

.order-info-row--first {
	margin: 0;
	padding: 0;
	border: 0;
}

.order-info-row span:first-child {
	color: var(--cj-text-muted);
}

.order-info-block {
	margin-block-start: 14px;
	padding-block-start: 12px;
	border-block-start: 1px solid var(--cj-border-light);
}

.order-info-label {
	display: block;
	margin-block-end: 4px;
	font-size: 13px;
	color: var(--cj-text-muted);
}

.order-info-hint {
	margin: 14px 0 0;
	font-size: 13px;
	line-height: 1.55;
	color: var(--cj-text-muted);
}

.order-tracking-number {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-block-start: 14px;
	padding: 14px 16px;
	border-radius: 12px;
	background: var(--cj-surface);
	font-size: 14px;
}

.order-tracking-number code {
	font-family: inherit;
	font-weight: 500;
	letter-spacing: 0.02em;
}

.order-tracking-number .btn {
	align-self: flex-start;
	padding: 12px 18px;
	font-size: 13px;
}

.order-updates ol {
	display: grid;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.order-update {
	padding: 14px 16px;
	border-radius: 12px;
	background: var(--cj-surface);
	font-size: 14px;
}

.order-update time {
	display: block;
	margin-block-end: 4px;
	font-size: 12px;
	color: var(--cj-text-muted);
}

.order-update p {
	margin: 0;
}

.order-update p + p {
	margin-block-start: 8px;
}

/* The CROWN Admin progress bar, aligned with the cards */
.account-page .crown-progress {
	margin: 0 0 20px;
	padding: 24px 28px;
	border-color: var(--cj-border);
	border-radius: var(--cj-radius-card);
}

.account-page .order-updates {
	margin-block-end: 20px;
}

/* Fallback tracker (without the plugin) */
.order-steps {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	margin: 0;
	padding: 0;
	list-style: none;
}

.order-steps li {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: var(--cj-text-muted);
	text-align: center;
}

.order-steps li::before {
	content: '';
	position: absolute;
	top: 17px;
	inset-inline-start: -50%;
	width: 100%;
	height: 2px;
	background: var(--cj-border);
}

.order-steps li:first-child::before {
	display: none;
}

.order-steps li.is-done::before,
.order-steps li.is-current::before {
	background: var(--cj-black);
}

.order-step-dot {
	position: relative;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border: 2px solid var(--cj-border);
	border-radius: 50%;
	background: var(--cj-white);
	font-size: 13px;
	font-weight: 600;
}

.order-steps li.is-done .order-step-dot {
	border-color: var(--cj-black);
	background: var(--cj-black);
	color: var(--cj-white);
}

.order-steps li.is-current .order-step-dot {
	border-color: var(--cj-black);
	box-shadow: 0 0 0 5px var(--cj-highlight);
}

.order-steps li.is-done,
.order-steps li.is-current {
	color: var(--cj-black);
	font-weight: 500;
}

/* -------------------------------------------------------------------------
   Addresses
   ------------------------------------------------------------------------- */
.address-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}

.address-card {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.address-card-head {
	display: flex;
	align-items: center;
	gap: 12px;
}

.address-card-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 12px;
	background: var(--cj-surface-2);
}

.address-card h2 {
	margin: 0;
	font-size: 18px;
	font-weight: 500;
}

.address-card address {
	flex: 1;
	margin: 0;
	font-style: normal;
	font-size: 15px;
	line-height: 1.7;
}

.address-card address .is-empty {
	color: var(--cj-text-muted);
}

.address-card .btn {
	align-self: flex-start;
	padding: 14px 20px;
	font-size: 14px;
}

/* -------------------------------------------------------------------------
   Forms (account details, address)
   ------------------------------------------------------------------------- */
.account-form form,
.account-form .woocommerce-address-fields__field-wrapper {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px 16px;
}

.account-form .woocommerce-address-fields {
	display: contents;
}

.account-form .form-row {
	margin: 0;
}

.account-form .form-row-wide,
.account-form form > .clear,
.account-form fieldset,
.account-form form > p:not(.form-row),
.account-form .woocommerce-address-fields > p,
.account-form h2 {
	grid-column: 1 / -1;
}

.account-form form > .clear,
.account-form h2:empty {
	display: none;
}

.account-form form > p:not(.form-row),
.account-form .woocommerce-address-fields > p {
	margin: 8px 0 0;
}

.account-form fieldset {
	display: grid;
	gap: 14px;
	margin: 8px 0 0;
	padding: 18px 20px 20px;
	border: 1px solid var(--cj-border-light);
	border-radius: 12px;
	background: var(--cj-surface);
}

.account-form legend {
	padding: 0 8px;
	font-size: 14px;
	font-weight: 500;
}

.account-form #account_display_name_description {
	display: block;
	margin-block-start: 6px;
	font-size: 12px;
	color: var(--cj-text-muted);
}

.account-form #account_display_name_description em {
	font-style: normal;
}

.account-form .button {
	padding: 16px 26px;
}

.cj-one-country .account-form #billing_country_field,
.cj-one-country .account-form #shipping_country_field {
	display: none;
}

/* -------------------------------------------------------------------------
   Login / registration / password
   ------------------------------------------------------------------------- */
.account-auth {
	max-width: 480px;
	margin: 12px auto 0;
}

.account-auth--two {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
	align-items: start;
	max-width: 1000px;
}

.account-auth-card {
	padding: 40px 40px 34px;
	border: 1px solid var(--cj-border);
	border-radius: var(--cj-radius-section);
	background: var(--cj-white);
	box-shadow: 0 20px 60px rgba(23, 23, 23, 0.06);
}

.account-auth-head {
	margin-block-end: 28px;
	text-align: center;
}

.account-auth-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	margin-block-end: 16px;
	border-radius: 50%;
	background: var(--cj-highlight);
}

.account-auth-head h1 {
	margin: 0 0 8px;
	font-size: 28px;
	letter-spacing: -0.02em;
}

.account-auth-head p {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
	color: var(--cj-text-muted);
}

.account-auth-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.account-auth-lost {
	color: var(--cj-black);
	font-size: 14px;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.account-auth .account-auth-submit {
	margin: 6px 0 0;
}

.account-auth .button {
	width: 100%;
	padding: 18px 26px;
}

.account-auth-note,
.account-auth-hint {
	margin: 18px 0 0;
	font-size: 13px;
	line-height: 1.6;
	color: var(--cj-text-muted);
	text-align: center;
}

.account-auth-hint {
	margin: 0 0 14px;
	text-align: start;
}

.account-auth-note a {
	color: var(--cj-black);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.account-auth-card p:empty {
	display: none;
}

.account-auth .woocommerce-privacy-policy-text {
	font-size: 12px;
	line-height: 1.6;
	color: var(--cj-text-muted);
}

.account-auth .woocommerce-ResetPassword .form-row-first,
.account-auth .woocommerce-ResetPassword .form-row-last {
	width: 100%;
}

/* Tracking page (no sidebar) */
.track-layout {
	max-width: 1080px;
	margin-inline: auto;
}

.track-page .account-head {
	margin-block-start: 8px;
}

.track-account-link {
	margin: 0;
	text-align: center;
	font-size: 14px;
}

.track-account-link a {
	color: var(--cj-black);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.account-auth-actions {
	margin: 0;
	text-align: center;
}

.account-auth-actions .btn {
	width: auto;
}

/* Pagination */
.account-pagination {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-block-start: 20px;
}

.account-pagination > span {
	font-size: 13px;
	color: var(--cj-text-muted);
}

.account-pagination .btn {
	padding: 14px 20px;
	font-size: 14px;
}

/* -------------------------------------------------------------------------
   Responsive
   ------------------------------------------------------------------------- */
@media (max-width: 1100px) {
	.account-tiles {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.order-layout {
		grid-template-columns: minmax(0, 1fr) 300px;
	}
}

@media (max-width: 960px) {
	.account-page .woocommerce {
		display: flex;
		flex-direction: column;
		gap: 16px;
	}

	.account-page--auth .woocommerce {
		display: block;
	}

	.account-sidebar {
		display: contents;
	}

	.account-user {
		order: 1;
		padding: 16px 18px;
	}

	.woocommerce-MyAccount-navigation {
		order: 2;
		padding: 6px;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	.woocommerce-MyAccount-navigation::-webkit-scrollbar {
		display: none;
	}

	.woocommerce-MyAccount-navigation ul {
		flex-direction: row;
		gap: 4px;
		width: max-content;
	}

	.account-page .woocommerce-MyAccount-navigation ul li a {
		padding: 10px 14px;
		font-size: 14px;
		white-space: nowrap;
	}

	.woocommerce-MyAccount-navigation-link--customer-logout {
		margin: 0;
		padding: 0;
		border: 0;
	}

	.woocommerce-MyAccount-content {
		order: 3;
		width: 100%;
	}

	.account-sidebar .account-help {
		order: 4;
		width: 100%;
	}

	.account-page .woocommerce:has(.account-help--full) .account-sidebar .account-help--side {
		display: none;
	}

	.account-head {
		margin-block: 8px 22px;
	}

	.order-layout {
		grid-template-columns: 1fr;
	}

	.account-stats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.account-stat--last {
		grid-column: 1 / -1;
	}

	.account-auth--two {
		grid-template-columns: 1fr;
	}

	.address-grid {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 600px) {
	.account-page {
		padding-block: 12px 64px;
	}

	.account-card,
	.order-card,
	.account-help {
		padding: 18px;
	}

	.account-tiles,
	.account-stats {
		grid-template-columns: 1fr;
	}

	.account-stat strong {
		font-size: 26px;
	}

	.order-card-body {
		align-items: flex-start;
	}

	.order-card-meta {
		align-items: flex-start;
		text-align: start;
	}

	.order-card-actions .btn,
	.address-card .btn {
		flex: 1 1 auto;
		justify-content: center;
	}

	.order-item {
		grid-template-columns: 60px minmax(0, 1fr);
	}

	.order-item-thumb {
		width: 60px;
		height: 60px;
	}

	.order-item-total {
		grid-column: 2;
	}

	.account-form form,
	.account-form .woocommerce-address-fields__field-wrapper {
		grid-template-columns: 1fr;
	}

	.account-auth-card {
		padding: 28px 22px 24px;
	}

	.account-pagination {
		flex-wrap: wrap;
	}

	.account-page .crown-progress {
		padding: 18px;
	}
}