.havir-account-dashboard {
	display: grid;
	gap: var(--space-5);
}

.havir-greeting-card {
	position: relative;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-4);
	padding: var(--space-6);
	background:
		radial-gradient(circle at 12% 20%, rgba(255, 215, 0, 0.28), transparent 30%),
		linear-gradient(135deg, var(--havir-red), var(--havir-navy));
	color: #fff;
	border-radius: var(--radius);
	box-shadow: var(--shadow-lg);
}

.havir-greeting-card::after {
	content: "";
	position: absolute;
	inset-block-end: -44px;
	inset-inline-start: -28px;
	inline-size: 180px;
	block-size: 180px;
	border: 1px solid rgba(255, 255, 255, 0.22);
	border-radius: 42px;
	transform: rotate(16deg);
}

.havir-greeting-card h2 {
	color: #fff;
}

.havir-greeting-card > * {
	position: relative;
	z-index: 1;
}

.havir-greeting-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
	margin-block-start: var(--space-4);
}

.havir-greeting-card__meta span {
	display: inline-flex;
	align-items: center;
	min-block-size: 34px;
	padding-inline: var(--space-3);
	border: 1px solid rgba(255, 255, 255, 0.22);
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.12);
	font-size: var(--font-sm);
	font-weight: 800;
}

.havir-greeting-card img {
	inline-size: 72px;
	block-size: 72px;
	border-radius: 50%;
	border: 3px solid rgba(255, 255, 255, 0.8);
}

.havir-account-stats {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--space-4);
}

.havir-stat-card,
.havir-loyalty-progress,
.havir-recent-orders,
.havir-order-card,
.havir-address-card {
	padding: var(--space-4);
	background: var(--havir-surface);
	border: 1px solid var(--havir-border);
	border-radius: var(--radius);
	box-shadow: var(--shadow);
}

.havir-stat-card {
	position: relative;
	overflow: hidden;
	display: grid;
	gap: var(--space-2);
	transition: var(--transition);
}

.havir-stat-card::after {
	content: "";
	position: absolute;
	inset-block-start: -34px;
	inset-inline-end: -34px;
	inline-size: 86px;
	block-size: 86px;
	border-radius: 50%;
	background: var(--havir-red-soft);
}

.havir-stat-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--shadow-lg);
}

.havir-stat-card__icon {
	position: relative;
	z-index: 1;
	display: grid;
	place-items: center;
	inline-size: 44px;
	block-size: 44px;
	border-radius: 50%;
	background: var(--havir-red-soft);
	color: var(--havir-red);
}

.havir-recent-orders,
.havir-order-card {
	overflow-x: auto;
}

.havir-order-card__status {
	margin-block-start: var(--space-3);
	margin-block-end: 0;
	color: var(--havir-muted);
	font-size: var(--font-sm);
}

.havir-stat-card strong {
	display: block;
	color: var(--havir-navy);
	font-size: var(--font-2xl);
}

.havir-progress {
	overflow: hidden;
	block-size: 12px;
	background: var(--havir-surface-alt);
	border-radius: 999px;
}

.havir-progress__bar {
	display: block;
	block-size: 100%;
	inline-size: var(--progress, 0%);
	background: linear-gradient(90deg, var(--havir-red), var(--havir-gold));
	border-radius: inherit;
	transition: inline-size 0.8s ease;
}

.havir-loyalty-progress {
	position: relative;
	overflow: hidden;
	background:
		linear-gradient(180deg, #fff, rgba(255, 215, 0, 0.1));
}

.havir-loyalty-progress__hint {
	margin-block-start: var(--space-3);
	color: var(--havir-muted);
	font-size: var(--font-sm);
}

.havir-loyalty-progress__head,
.havir-section-mini-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--space-4);
	margin-block-end: var(--space-4);
}

.havir-loyalty-progress__head strong {
	display: grid;
	place-items: center;
	inline-size: 74px;
	block-size: 74px;
	border-radius: 50%;
	background: var(--havir-navy);
	color: #fff;
	font-size: var(--font-xl);
}

.havir-loyalty-redeem {
	display: grid;
	grid-template-columns: minmax(120px, 1fr) minmax(90px, 120px) auto auto;
	gap: var(--space-3);
	align-items: end;
	margin-block-start: var(--space-5);
}

.havir-loyalty-redeem [data-discount-output] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-block-size: 48px;
	padding-inline: var(--space-3);
	border-radius: var(--radius-sm);
	background: var(--havir-surface-alt);
	color: var(--havir-red);
	font-weight: 900;
}

.havir-loyalty-message {
	grid-column: 1 / -1;
	padding: var(--space-3);
	border-radius: var(--radius-sm);
	background: var(--havir-surface-alt);
}

.havir-loyalty-message.has-success {
	color: var(--havir-success);
}

.havir-loyalty-message.has-error {
	color: var(--havir-error);
}

.havir-section-mini-head a {
	color: var(--havir-red);
	font-weight: 800;
}

.havir-recent-orders .shop_table td:last-child a {
	color: var(--havir-red);
	font-weight: 800;
}

.havir-quick-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3);
}

.status-badge {
	display: inline-flex;
	align-items: center;
	min-block-size: 28px;
	padding-inline: var(--space-3);
	border-radius: 999px;
	background: var(--havir-red-soft);
	color: var(--havir-red);
	font-size: var(--font-sm);
	font-weight: 800;
}

.havir-order-timeline {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: var(--space-3);
	margin-block: var(--space-6);
	position: relative;
}

.havir-order-step {
	position: relative;
	display: grid;
	gap: var(--space-2);
	justify-items: center;
	text-align: center;
	color: var(--havir-muted);
}

.havir-order-step::before {
	content: "";
	position: absolute;
	inset-block-start: 19px;
	inset-inline-start: 50%;
	inline-size: 100%;
	block-size: 3px;
	background: var(--havir-border);
	z-index: 0;
}

.havir-order-step:last-child::before {
	display: none;
}

.havir-order-step__dot {
	position: relative;
	z-index: 1;
	display: grid;
	place-items: center;
	inline-size: 40px;
	block-size: 40px;
	border-radius: 50%;
	background: var(--havir-border);
	color: #fff;
	font-weight: 900;
}

.havir-order-step.is-complete {
	color: var(--havir-success);
}

.havir-order-step.is-complete::before,
.havir-order-step.is-complete .havir-order-step__dot {
	background: var(--havir-success);
}

.havir-order-step.is-current .havir-order-step__dot {
	background: var(--havir-red);
	animation: pulse 1.6s infinite;
}

.havir-tracking-code {
	display: flex;
	gap: var(--space-2);
	align-items: center;
	padding: var(--space-3);
	background: var(--havir-surface-alt);
	border-radius: var(--radius-sm);
}

.woocommerce-OrderUpdates {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: var(--space-3);
}

.woocommerce-OrderUpdate {
	padding: var(--space-4);
	border: 1px solid var(--havir-border);
	border-radius: var(--radius-sm);
	background: var(--havir-surface-alt);
}

.woocommerce-OrderUpdate-meta {
	margin-block-end: var(--space-2);
	color: var(--havir-muted);
	font-size: var(--font-sm);
	font-weight: 700;
}

.woocommerce-OrderUpdate-description > :last-child {
	margin-block-end: 0;
}

.havir-level-card.is-current {
	border-color: var(--havir-gold);
	box-shadow: 0 0 0 4px rgba(255, 215, 0, 0.2), var(--shadow);
}

@media (max-width: 1023px) {
	.havir-account-stats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 767px) {
	.havir-greeting-card,
	.havir-quick-actions,
	.havir-tracking-code {
		align-items: stretch;
		flex-direction: column;
	}

	.havir-account-stats {
		grid-template-columns: 1fr;
	}

	.havir-greeting-card,
	.havir-stat-card,
	.havir-loyalty-progress,
	.havir-recent-orders,
	.havir-order-card,
	.havir-address-card {
		padding: var(--space-4);
	}

	.havir-loyalty-redeem {
		grid-template-columns: 1fr;
	}

	.havir-loyalty-progress__head,
	.havir-section-mini-head {
		flex-direction: column;
	}

	.havir-order-timeline {
		grid-template-columns: 1fr;
	}

	.havir-order-step {
		grid-template-columns: 40px 1fr;
		justify-items: start;
		text-align: start;
	}

	.havir-order-step::before {
		inset-inline-start: 19px;
		inset-block-start: 40px;
		inline-size: 3px;
		block-size: calc(100% + var(--space-3));
	}
}

/* ============================================
   HAVIR DEDICATED ORDER TRACKING STYLES
   ============================================ */
.havir-tracking-page {
	padding-block: clamp(24px, 4vw, 48px);
}

.havir-tracking-header {
	display: flex;
	align-items: center;
	gap: 20px;
	padding: 24px 28px;
	background: radial-gradient(circle at 12% 20%, rgba(227, 24, 55, 0.07), transparent 35%), linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
	border: 1px solid var(--havir-border, #e2e8f0);
	border-radius: 18px;
	margin-bottom: 24px;
	box-shadow: 0 4px 20px -4px rgba(0, 0, 0, 0.04);
}

.havir-tracking-header__icon {
	width: 60px;
	height: 60px;
	border-radius: 16px;
	background: linear-gradient(135deg, var(--havir-red, #e31837), #991b1b);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	box-shadow: 0 6px 16px rgba(227, 24, 55, 0.28);
}

.havir-tracking-header__icon svg {
	width: 30px !important;
	height: 30px !important;
}

.havir-tracking-header__content h1 {
	font-size: clamp(1.2rem, 2.5vw, 1.6rem);
	font-weight: 800;
	margin-bottom: 6px;
	color: var(--havir-text, #1e293b);
}

.havir-tracking-header__content p {
	font-size: 0.95rem;
	color: #64748b;
	margin: 0;
	line-height: 1.6;
}

.havir-tracking-card {
	background: #ffffff;
	border: 1px solid var(--havir-border, #e2e8f0);
	border-radius: 18px;
	padding: clamp(20px, 3vw, 30px);
	margin-bottom: 24px;
	box-shadow: 0 4px 16px -2px rgba(15, 23, 42, 0.04);
	transition: box-shadow 0.2s ease;
}

.havir-tracking-card:hover {
	box-shadow: 0 8px 24px -4px rgba(15, 23, 42, 0.07);
}

.havir-tracking-section-title {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 1.15rem;
	font-weight: 800;
	color: var(--havir-text, #1e293b);
	margin-bottom: 22px;
	padding-bottom: 12px;
	border-bottom: 2px solid #f1f5f9;
}

.havir-tracking-section-title svg {
	width: 22px !important;
	height: 22px !important;
	color: var(--havir-red, #e31837);
}

/* 1. ORDER SUMMARY */
.havir-order-summary-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	gap: 14px;
	margin-bottom: 20px;
}

.havir-summary-item {
	background: #f8fafc;
	border: 1px solid #edf2f7;
	border-radius: 14px;
	padding: 14px 18px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.havir-summary-label {
	font-size: 0.82rem;
	color: #64748b;
	font-weight: 600;
}

.havir-summary-value {
	font-size: 1.05rem;
	font-weight: 800;
	color: var(--havir-text, #0f172a);
}

.havir-summary-value.text-red {
	color: var(--havir-red, #e31837);
}

.havir-status-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	width: fit-content;
	padding: 4px 12px;
	border-radius: 999px;
	font-size: 0.85rem;
	font-weight: 700;
	background: #e2e8f0;
	color: #334155;
}

.havir-status-badge.status-completed {
	background: #dcfce7;
	color: #166534;
}

.havir-status-badge.status-processing,
.havir-status-badge.status-on-hold {
	background: #e0f2fe;
	color: #0369a1;
}

.havir-status-badge.status-pending {
	background: #fef3c7;
	color: #b45309;
}

.havir-status-badge.status-cancelled,
.havir-status-badge.status-failed {
	background: #fee2e2;
	color: #991b1b;
}

/* Post Code Box */
.havir-post-code-box {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 16px;
	padding: 16px 20px;
	background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
	border: 1.5px dashed #86efac;
	border-radius: 14px;
}

.havir-post-code-label {
	display: flex;
	align-items: center;
	gap: 10px;
	color: #166534;
	font-size: 0.95rem;
}

.havir-post-code-label svg {
	width: 22px !important;
	height: 22px !important;
}

.havir-post-code-value {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
}

.havir-post-code-value code {
	background: #ffffff;
	border: 1px solid #bbf7d0;
	padding: 6px 14px;
	border-radius: 8px;
	font-family: monospace;
	font-size: 1.1rem;
	font-weight: 800;
	color: #14532d;
	letter-spacing: 1.5px;
}

/* 2. HORIZONTAL & CHECKERED BENTO TIMELINE GRID (چهارخونه و افقی) */
.havir-tracking-grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 14px;
	position: relative;
	margin-block: 10px;
}

.havir-tracking-tile {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	background: #ffffff;
	border: 1.5px solid #e2e8f0;
	border-radius: 16px;
	padding: 22px 14px 18px 14px;
	position: relative;
	transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
	box-shadow: 0 2px 6px rgba(15, 23, 42, 0.03);
}

.havir-tracking-tile:hover {
	transform: translateY(-3px);
	border-color: #cbd5e1;
	box-shadow: 0 8px 16px -2px rgba(15, 23, 42, 0.06);
}

.havir-tracking-tile__icon-wrap {
	position: relative;
	width: 58px;
	height: 58px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #f1f5f9;
	color: #94a3b8;
	margin-bottom: 14px;
	transition: all 0.25s ease;
}

.havir-tracking-tile__icon svg {
	width: 26px !important;
	height: 26px !important;
	display: block;
}

.havir-tracking-tile__num {
	position: absolute;
	top: -3px;
	right: -3px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	font-size: 11px;
	font-weight: 800;
	background: #cbd5e1;
	color: #334155;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 2px solid #ffffff;
}

.havir-tracking-tile__title {
	font-size: 0.92rem;
	font-weight: 800;
	color: #334155;
	margin: 0 0 6px 0;
	line-height: 1.4;
}

.havir-tracking-tile__desc {
	font-size: 0.78rem;
	color: #64748b;
	margin: 0 0 12px 0;
	line-height: 1.45;
	flex-grow: 1;
}

.havir-tracking-tile__tag {
	display: inline-block;
	padding: 3px 10px;
	border-radius: 999px;
	font-size: 0.72rem;
	font-weight: 700;
	background: #f1f5f9;
	color: #64748b;
}

/* State: is-complete */
.havir-tracking-tile.is-complete {
	background: #fcfdfd;
	border-color: #86efac;
}

.havir-tracking-tile.is-complete .havir-tracking-tile__icon-wrap {
	background: linear-gradient(135deg, #10b981 0%, #059669 100%);
	color: #ffffff;
	box-shadow: 0 4px 12px rgba(16, 185, 129, 0.25);
}

.havir-tracking-tile.is-complete .havir-tracking-tile__num {
	background: #059669;
	color: #ffffff;
}

.havir-tracking-tile.is-complete .havir-tracking-tile__title {
	color: #065f46;
}

.havir-tracking-tile.is-complete .havir-tracking-tile__tag {
	background: #dcfce7;
	color: #15803d;
}

/* State: is-current */
.havir-tracking-tile.is-current {
	background: #ffffff;
	border-color: var(--havir-red, #e31837);
	box-shadow: 0 8px 24px -4px rgba(227, 24, 55, 0.16);
	transform: translateY(-4px);
}

.havir-tracking-tile.is-current .havir-tracking-tile__icon-wrap {
	background: linear-gradient(135deg, var(--havir-red, #e31837) 0%, #b91c1c 100%);
	color: #ffffff;
	box-shadow: 0 6px 16px rgba(227, 24, 55, 0.35);
}

.havir-tracking-tile.is-current .havir-tracking-tile__num {
	background: #b91c1c;
	color: #ffffff;
}

.havir-tracking-tile.is-current .havir-tracking-tile__title {
	color: var(--havir-red, #e31837);
}

.havir-tracking-tile.is-current .havir-tracking-tile__tag {
	background: #fee2e2;
	color: #b91c1c;
}

/* Order items table */
.havir-order-table {
	width: 100%;
	border-collapse: collapse;
}

.havir-order-table th {
	background: #f8fafc;
	padding: 12px 16px;
	text-align: start;
	font-weight: 700;
	color: #475569;
	border-bottom: 2px solid #e2e8f0;
}

.havir-order-table td {
	padding: 14px 16px;
	border-bottom: 1px solid #f1f5f9;
	vertical-align: middle;
}

.havir-order-prod-cell {
	display: flex;
	align-items: center;
	gap: 14px;
}

.havir-order-prod-cell img {
	width: 54px;
	height: 54px;
	object-fit: cover;
	border-radius: 8px;
	border: 1px solid #e2e8f0;
}

/* Tracking Form */
.havir-tracking-form-card {
	background: #ffffff;
}

.havir-tracking-form__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
	margin-bottom: 24px;
}

.havir-tracking-form .havir-form-group {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.havir-tracking-form label {
	font-size: 0.95rem;
	font-weight: 700;
	color: #334155;
}

.havir-tracking-form input[type="text"],
.havir-tracking-form input[type="email"] {
	height: 48px;
	border: 1.5px solid #cbd5e1;
	border-radius: 12px;
	padding: 0 16px;
	font-size: 0.95rem;
	background: #f8fafc;
	transition: all 0.2s ease;
}

.havir-tracking-form input:focus {
	border-color: var(--havir-red, #e31837);
	background: #ffffff;
	box-shadow: 0 0 0 3px rgba(227, 24, 55, 0.12);
	outline: none;
}

.havir-tracking-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	height: 50px;
	padding: 0 28px;
	font-size: 1rem;
	font-weight: 700;
	border-radius: 12px;
	cursor: pointer;
}

.havir-tracking-btn svg {
	width: 20px !important;
	height: 20px !important;
}

.havir-tracking-perks {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
	margin-top: 32px;
	padding-top: 24px;
	border-top: 1px solid #f1f5f9;
}

.havir-perk-item {
	text-align: center;
	padding: 14px;
	border-radius: 12px;
	background: #f8fafc;
}

.havir-perk-icon {
	font-size: 1.8rem;
	display: block;
	margin-bottom: 8px;
}

.havir-perk-item strong {
	display: block;
	font-size: 0.92rem;
	color: #1e293b;
	margin-bottom: 4px;
}

.havir-perk-item p {
	font-size: 0.8rem;
	color: #64748b;
	margin: 0;
	line-height: 1.5;
}

/* ============================================
   RESPONSIVE BREAKPOINTS FOR TRACKING
   ============================================ */
@media (max-width: 992px) {
	.havir-tracking-grid {
		grid-template-columns: repeat(3, 1fr);
	}
	.havir-tracking-perks {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 768px) {
	.havir-tracking-form__grid {
		grid-template-columns: 1fr;
	}
	.havir-tracking-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 480px) {
	.havir-tracking-grid {
		grid-template-columns: 1fr;
	}
	.havir-tracking-tile {
		flex-direction: row;
		text-align: start;
		gap: 14px;
		align-items: center;
		padding: 14px;
	}
	.havir-tracking-tile__icon-wrap {
		margin-bottom: 0;
		flex-shrink: 0;
	}
}

/* ============================================
   PROTECTION & BEAUTIFICATION FOR THIRD-PARTY TRACKING PLUGINS
   (Postino, Tapin, Iran Post Tracker, WooCommerce standard)
   ============================================ */
.woocommerce-view-order svg,
.woocommerce-order-details svg,
.havir-order-card svg,
.woocommerce-account svg:not(.havir-icon),
[class*="tracking"] svg,
[class*="shipment"] svg,
[class*="post-"] svg,
[class*="post_"] svg,
[id*="tracking"] svg,
[id*="shipment"] svg,
.order-tracking svg,
.post-tracking svg {
	width: 24px !important;
	height: 24px !important;
	max-width: 28px !important;
	max-height: 28px !important;
	min-width: 16px !important;
	min-height: 16px !important;
	display: inline-block !important;
	vertical-align: middle !important;
	flex-shrink: 0 !important;
}

[class*="tracking"],
[class*="shipment"],
[id*="tracking"],
[id*="shipment"] {
	max-width: 100% !important;
}

/* Transform third-party vertical stepper lists into horizontal / grid cards */
[class*="tracking"] ul:not(.havir-primary-menu),
[class*="tracking"] ol,
[class*="shipment"] ul,
[class*="shipment"] ol,
.order-tracking ul,
.order-tracking ol,
.woocommerce-order-overview {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)) !important;
	gap: 12px !important;
	list-style: none !important;
	margin: 16px 0 !important;
	padding: 0 !important;
}

[class*="tracking"] ul:not(.havir-primary-menu) > li,
[class*="tracking"] ol > li,
[class*="shipment"] ul > li,
[class*="shipment"] ol > li,
.order-tracking ul > li,
.order-tracking ol > li,
.woocommerce-order-overview > li {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	text-align: center !important;
	background: #f8fafc !important;
	border: 1px solid #e2e8f0 !important;
	border-radius: 12px !important;
	padding: 14px 10px !important;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.02) !important;
}

[class*="tracking"] table,
[class*="shipment"] table {
	width: 100% !important;
	border-collapse: collapse !important;
	margin: 16px 0 !important;
	border: 1px solid #e2e8f0 !important;
	border-radius: 12px !important;
	overflow: hidden;
}

[class*="tracking"] img,
[class*="shipment"] img {
	max-height: 44px !important;
	width: auto !important;
	object-fit: contain !important;
}

/* ============================================================
   DELUXE PARCEL & ORDER TRACKING DASHBOARD
   (High-end grade-1 eCommerce tracking experience)
   ============================================================ */

.havir-tracking-dashboard {
	display: grid;
	gap: var(--space-5, 20px);
	width: 100%;
	animation: havirFadeIn 0.35s ease;
}

@keyframes havirFadeIn {
	from { opacity: 0; transform: translateY(6px); }
	to { opacity: 1; transform: translateY(0); }
}

/* 1. Hero Order Summary Card */
.havir-tracking-hero-card {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--space-4, 16px);
	padding: var(--space-5, 20px);
	background: linear-gradient(135deg, #ffffff, #f8fafc);
	border: 1px solid var(--havir-border, #e2e8f0);
	border-radius: var(--radius, 16px);
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03);
}

.havir-tracking-hero-info {
	display: flex;
	align-items: center;
	gap: var(--space-3, 14px);
}

.havir-tracking-hero-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	inline-size: 52px;
	block-size: 52px;
	border-radius: 14px;
	background: linear-gradient(135deg, var(--havir-red, #e63946), #d90429);
	color: #ffffff;
	box-shadow: 0 6px 16px rgba(230, 57, 70, 0.25);
	flex-shrink: 0;
}

.havir-tracking-hero-title {
	font-size: 1.25rem !important;
	font-weight: 800 !important;
	color: var(--havir-navy, #0f172a) !important;
	margin: 0 !important;
	line-height: 1.3 !important;
}

.havir-tracking-hero-desc {
	font-size: 0.85rem !important;
	color: var(--havir-muted, #64748b) !important;
	margin: 4px 0 0 0 !important;
}

.havir-tracking-meta-badges {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--space-2, 8px);
}

.havir-meta-badge {
	display: inline-flex;
	align-items: center;
	padding: 6px 12px;
	background: #f1f5f9;
	border: 1px solid #e2e8f0;
	border-radius: 999px;
	font-size: 0.82rem;
	font-weight: 700;
	color: var(--havir-navy, #1e293b);
}

.havir-meta-badge--order {
	background: rgba(230, 57, 70, 0.08);
	border-color: rgba(230, 57, 70, 0.2);
	color: var(--havir-red, #e63946);
	font-family: monospace, Tahoma, sans-serif;
	font-size: 0.9rem;
}

.havir-meta-badge--price {
	background: #ecfdf5;
	border-color: #a7f3d0;
	color: #059669;
}

/* 2. Deluxe 4-Step Animated Stepper */
.havir-deluxe-stepper {
	position: relative;
	padding: 32px 24px 28px 24px;
	background: var(--havir-surface, #ffffff);
	border: 1px solid var(--havir-border, #e2e8f0);
	border-radius: var(--radius, 16px);
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03);
}

.havir-deluxe-stepper__track {
	position: absolute;
	top: 56px;
	right: 48px;
	left: 48px;
	height: 6px;
	background: #e2e8f0;
	border-radius: 999px;
	z-index: 1;
}

.havir-deluxe-stepper__fill {
	height: 100%;
	background: linear-gradient(90deg, #10b981, var(--havir-red, #e63946));
	border-radius: 999px;
	transition: width 0.8s cubic-bezier(0.4, 0, 0.2, 1);
	box-shadow: 0 0 10px rgba(230, 57, 70, 0.35);
}

.havir-deluxe-stepper__steps {
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 12px;
}

.havir-deluxe-step {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 8px;
}

.havir-deluxe-step__node {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	inline-size: 50px;
	block-size: 50px;
	border-radius: 50%;
	background: #ffffff;
	border: 3px solid #cbd5e1;
	color: #94a3b8;
	transition: all 0.3s ease;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.havir-deluxe-step.is-done .havir-deluxe-step__node {
	background: #10b981;
	border-color: #10b981;
	color: #ffffff;
	box-shadow: 0 4px 14px rgba(16, 185, 129, 0.35);
}

.havir-deluxe-step.is-current .havir-deluxe-step__node {
	background: #ffffff;
	border-color: var(--havir-red, #e63946);
	color: var(--havir-red, #e63946);
	transform: scale(1.12);
	box-shadow: 0 4px 18px rgba(230, 57, 70, 0.3);
}

.havir-deluxe-step__title {
	font-size: 0.95rem;
	font-weight: 800;
	color: var(--havir-navy, #0f172a);
	margin-top: 4px;
}

.havir-deluxe-step.is-pending .havir-deluxe-step__title {
	color: #94a3b8;
}

.havir-deluxe-step__status {
	font-size: 0.76rem;
	font-weight: 700;
	color: #64748b;
	padding: 2px 8px;
	background: #f1f5f9;
	border-radius: 999px;
}

.havir-deluxe-step.is-done .havir-deluxe-step__status {
	background: #ecfdf5;
	color: #059669;
}

.havir-deluxe-step__status.status--active {
	background: rgba(230, 57, 70, 0.1);
	color: var(--havir-red, #e63946);
	border: 1px solid rgba(230, 57, 70, 0.2);
}

/* 3. Parcel Details & Tracking Code Card */
.havir-parcel-card {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--space-4, 16px);
	padding: var(--space-5, 22px);
	background: #ffffff;
	border: 2px solid rgba(230, 57, 70, 0.15);
	border-radius: var(--radius, 16px);
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.04);
}

.havir-parcel-info {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--space-5, 20px);
}

.havir-parcel-carrier {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.havir-carrier-pill {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 14px;
	background: var(--havir-navy, #0f172a);
	color: #ffffff;
	border-radius: 999px;
	font-size: 0.88rem;
}

.havir-carrier-pill svg {
	color: var(--havir-red, #e63946);
}

.havir-ship-date {
	font-size: 0.78rem;
	color: var(--havir-muted, #64748b);
	font-weight: 600;
}

.havir-tracking-box {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.havir-tracking-label {
	font-size: 0.82rem;
	font-weight: 700;
	color: #475569;
}

.havir-tracking-input-group {
	display: flex;
	align-items: center;
	gap: 6px;
	background: #f8fafc;
	border: 1px solid #cbd5e1;
	border-radius: 10px;
	padding: 4px 6px;
}

.havir-tracking-code-val {
	font-family: "SFMono-Regular", Consolas, monospace;
	font-size: 1.15rem;
	font-weight: 800;
	color: var(--havir-navy, #0f172a);
	padding: 2px 10px;
	letter-spacing: 1px;
}

.havir-tracking-copy-btn {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 6px 14px;
	border: none;
	border-radius: 8px;
	background: #ffffff;
	color: var(--havir-navy, #0f172a);
	font-size: 0.82rem;
	font-weight: 700;
	cursor: pointer;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
	transition: all 0.2s ease;
}

.havir-tracking-copy-btn:hover {
	background: var(--havir-red, #e63946);
	color: #ffffff;
}

.havir-tracking-copy-btn.is-copied {
	background: #10b981 !important;
	color: #ffffff !important;
}

.havir-parcel-actions {
	display: flex;
	align-items: center;
}

.havir-track-action-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 22px;
	background: linear-gradient(135deg, var(--havir-red, #e63946), #c1121f);
	color: #ffffff !important;
	text-decoration: none !important;
	border-radius: 12px;
	font-size: 0.95rem;
	font-weight: 800;
	box-shadow: 0 4px 14px rgba(230, 57, 70, 0.3);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.havir-track-action-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(230, 57, 70, 0.4);
	color: #ffffff !important;
}

/* Responsive Stepper for Tablets & Phones */
@media (max-width: 768px) {
	.havir-deluxe-stepper__track {
		display: none;
	}

	.havir-deluxe-stepper__steps {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.havir-deluxe-step {
		flex-direction: row;
		text-align: start;
		gap: 16px;
	}

	.havir-parcel-card {
		flex-direction: column;
		align-items: stretch;
	}

	.havir-track-action-btn {
		justify-content: center;
		width: 100%;
	}
}

/* Stepper Node Pulse Ring */
.havir-stepper__pulse {
	position: absolute;
	inset: -6px;
	border-radius: 50%;
	border: 2px solid var(--havir-red, #e63946);
	animation: havirPulseRing 1.8s cubic-bezier(0.24, 0, 0.38, 1) infinite;
	pointer-events: none;
}

@keyframes havirPulseRing {
	0% {
		transform: scale(0.9);
		opacity: 0.9;
	}
	70% {
		transform: scale(1.4);
		opacity: 0;
	}
	100% {
		transform: scale(1.4);
		opacity: 0;
	}
}

/* Direct Fallback Styling for Raw Plugin Output in Account */
.woocommerce-MyAccount-content a[href*="tracking"],
.woocommerce-MyAccount-content a[href*="post"],
.woocommerce-MyAccount-content a[href*="deka"],
.woocommerce-MyAccount-content a[href*="tipax"] {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 20px;
	background: linear-gradient(135deg, var(--havir-red, #e63946), #c1121f);
	color: #ffffff !important;
	text-decoration: none !important;
	border-radius: 10px;
	font-weight: 800;
	box-shadow: 0 4px 14px rgba(230, 57, 70, 0.25);
	margin-top: 10px;
	transition: all 0.2s ease;
}

.woocommerce-MyAccount-content a[href*="tracking"]:hover,
.woocommerce-MyAccount-content a[href*="post"]:hover,
.woocommerce-MyAccount-content a[href*="deka"]:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(230, 57, 70, 0.35);
}


