/* Membership Discounts – by Jack */

:root {
	--j-md-bronze: #a0673a;
	--j-md-silver: #8e9aaf;
	--j-md-gold: #c9a227;
	--j-md-platinum: #5f7d8c;
	--j-md-diamond: #3a7bd5;
	--j-md-track: #e9ecef;
	--j-md-fill-start: #36d1a3;
	--j-md-fill-end: #1e9e7a;
}

/* Badge next to prices / in tier table */
.j-md-badge {
	display: inline-block;
	padding: 2px 8px;
	border-radius: 999px;
	font-size: 0.75em;
	font-weight: 600;
	line-height: 1.6;
	color: #fff;
	background: #555;
	vertical-align: middle;
	white-space: nowrap;
}
.j-md-badge--bronze   { background: var(--j-md-bronze); }
.j-md-badge--silver   { background: var(--j-md-silver); }
.j-md-badge--gold     { background: var(--j-md-gold); }
.j-md-badge--platinum { background: var(--j-md-platinum); }
.j-md-badge--diamond  { background: var(--j-md-diamond); }

/* My Account tab */
.j-md-account { display: flex; flex-direction: column; gap: 24px; }

.j-md-card {
	border-radius: 14px;
	padding: 22px 24px;
	color: #fff;
	background: linear-gradient(135deg, #6c757d, #495057);
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
}
.j-md-card--bronze   { background: linear-gradient(135deg, #c98b5a, #8a5229); }
.j-md-card--silver   { background: linear-gradient(135deg, #b8c2d1, #7d8aa1); }
.j-md-card--gold     { background: linear-gradient(135deg, #e6c45a, #b88a12); }
.j-md-card--platinum { background: linear-gradient(135deg, #8fa9b6, #4b6674); }
.j-md-card--diamond  { background: linear-gradient(135deg, #6fb1fc, #2b5fbf); }

.j-md-card__label  { font-size: 0.8em; text-transform: uppercase; letter-spacing: 0.08em; opacity: 0.85; }
.j-md-card__tier   { font-size: 2em; font-weight: 700; line-height: 1.2; margin: 4px 0; }
.j-md-card__meta   { font-size: 1em; opacity: 0.95; }
.j-md-card__spent  { margin-top: 12px; font-size: 0.95em; }
.j-md-card__spent .amount { color: #fff; }

.j-md-progress-head,
.j-md-progress-foot {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 8px;
}
.j-md-progress-head { margin-bottom: 8px; }
.j-md-progress-foot { margin-top: 8px; font-size: 0.9em; color: #666; }
.j-md-progress-percent { font-size: 1.4em; font-weight: 700; }

.j-md-progress {
	position: relative;
	height: 26px;
	border-radius: 999px;
	background: var(--j-md-track);
	overflow: hidden;
}
.j-md-progress__fill {
	height: 100%;
	min-width: 2%;
	border-radius: 999px;
	background: linear-gradient(90deg, var(--j-md-fill-start), var(--j-md-fill-end));
	display: flex;
	align-items: center;
	justify-content: flex-end;
	padding-right: 10px;
	box-sizing: border-box;
	color: #fff;
	font-size: 0.8em;
	font-weight: 700;
	transition: width 0.8s ease;
}

.j-md-heading { margin: 0; }

.j-md-journey { padding: 10px 8px 4px; }
.j-md-journey__track {
	position: relative;
	height: 6px;
	border-radius: 999px;
	background: var(--j-md-track);
}
.j-md-journey__fill {
	position: absolute;
	inset: 0 auto 0 0;
	border-radius: 999px;
	background: linear-gradient(90deg, var(--j-md-fill-start), var(--j-md-fill-end));
}
.j-md-journey__dot {
	position: absolute;
	top: 50%;
	width: 16px;
	height: 16px;
	margin: -8px 0 0 -8px;
	border-radius: 50%;
	background: #fff;
	border: 3px solid #ced4da;
	box-sizing: border-box;
}
.j-md-journey__dot.is-achieved.j-md-journey__dot--bronze   { border-color: var(--j-md-bronze);   background: var(--j-md-bronze); }
.j-md-journey__dot.is-achieved.j-md-journey__dot--silver   { border-color: var(--j-md-silver);   background: var(--j-md-silver); }
.j-md-journey__dot.is-achieved.j-md-journey__dot--gold     { border-color: var(--j-md-gold);     background: var(--j-md-gold); }
.j-md-journey__dot.is-achieved.j-md-journey__dot--platinum { border-color: var(--j-md-platinum); background: var(--j-md-platinum); }
.j-md-journey__dot.is-achieved.j-md-journey__dot--diamond  { border-color: var(--j-md-diamond);  background: var(--j-md-diamond); }

.j-md-tiers tr.is-current td { font-weight: 700; background: rgba(54, 209, 163, 0.08); }

.j-md-note { font-size: 0.85em; color: #777; margin: 0; }

/* VIP discount row in cart / checkout totals */
tr.j-md-vip-row th,
tr.j-md-vip-row td { font-weight: 700; }
tr.j-md-vip-row td .amount { color: #1e9e7a; }

/* Points history + how it works */
.j-md-history td, .j-md-history th { font-size: 0.95em; }
.j-md-howto ul { margin: 8px 0 0 1.2em; }
.j-md-howto li { margin-bottom: 4px; }

/* [membership_discount] shortcode */
.j-md-sc { border: 1px solid #e5e7eb; border-radius: 12px; padding: 14px 16px; margin: 14px 0; max-width: 420px; }
.j-md-sc__title { font-weight: 700; margin-bottom: 8px; }
.j-md-sc__table { width: 100%; border-collapse: collapse; margin: 0; }
.j-md-sc__table td { padding: 6px 4px; border: 0; border-top: 1px solid #f0f0f0; vertical-align: middle; }
.j-md-sc__table tr:first-child td { border-top: 0; }
.j-md-sc__table tr.is-current td { background: rgba(54, 209, 163, 0.10); }
.j-md-sc__you { font-size: 0.8em; color: #1e9e7a; margin-left: 4px; }
.j-md-sc__note { font-size: 0.8em; color: #777; margin-top: 8px; }

/* "Choose your discount" box in cart / checkout totals: full-width row, one option per line */
tr.j-md-choice-row td {
	text-align: left !important;
	padding-top: 14px;
	padding-bottom: 14px;
}
tr.j-md-choice-row td::before { content: none !important; display: none !important; }
.j-md-choice__title { font-weight: 700; margin-bottom: 10px; }
.j-md-choice { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; transition: opacity 0.2s; }
.j-md-choice li { margin: 0; padding: 0; list-style: none; }
.j-md-choice label {
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
	box-sizing: border-box;
	padding: 12px 14px;
	border: 1px solid #e0e0e0;
	border-radius: 8px;
	cursor: pointer;
	font-weight: 400;
	line-height: 1.4;
	margin: 0;
}
.j-md-choice li.is-selected label { border-color: #1e9e7a; background: rgba(54, 209, 163, 0.08); }
.j-md-choice input[type=radio] { margin: 0; flex: 0 0 auto; }
.j-md-choice__label { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.j-md-choice__amount { flex: 0 0 auto; margin-left: auto; font-weight: 700; color: #1e9e7a; white-space: nowrap; }
.j-md-choice__amount .amount { color: inherit; }
.j-md-choice__best { font-size: 0.7em; font-weight: 700; text-transform: uppercase; color: #fff; background: #1e9e7a; border-radius: 999px; padding: 1px 7px; line-height: 1.6; }
.j-md-choice__note { display: block; margin-top: 8px; color: #777; }

/* Coupon row is hidden when another discount is chosen (the chooser lists the coupon). */
tr:has(.j-md-coupon-hidden),
tr.j-md-coupon-hidden-row { display: none !important; }