.content-area {
  width: 100% !important;
}
/* ==========================================================================
   Affiliate dashboard: what you earn, your level, bonuses (3.0.0)
   Shared by both dashboard layouts; every name carries the plugin prefix and
   the blocks inherit each layout's own surface, so the surrounding design of
   template one and template two is left alone.
   ========================================================================== */
.rtwapwcm_dash_block {
	/* flow-root: a child's bottom margin stays inside the block instead of collapsing through it —
	   template two's block has no border, and without this the rules panel sat flush on the card edge */
	display: flow-root;
	--rtwapwcm-dash-ink: #1d2327;
	--rtwapwcm-dash-muted: #5c6470;
	--rtwapwcm-dash-line: #e4e7ec;
	--rtwapwcm-dash-surface: #fff;
	--rtwapwcm-dash-raise: #f7f8fa;
	--rtwapwcm-dash-accent: #4b6fff;
	--rtwapwcm-dash-accent-soft: #eef2ff;
	--rtwapwcm-dash-warn: #7a5200;
	--rtwapwcm-dash-warn-soft: #fff4d6;
	--rtwapwcm-dash-radius: 10px;
	--rtwapwcm-dash-pad: 22px;
	--rtwapwcm-dash-gap: 14px;
	/* one type scale for the affiliate-facing blocks, in the sizes the owner asked for */
	--rtwapwcm-dash-title: 19px;
	--rtwapwcm-dash-lead: 16px;
	--rtwapwcm-dash-text: 15px;
	--rtwapwcm-dash-small: 14px;
	--rtwapwcm-dash-micro: 12px;
	--rtwapwcm-dash-amount: 30px;
	background: var(--rtwapwcm-dash-surface);
	border: 1px solid var(--rtwapwcm-dash-line);
	border-radius: var(--rtwapwcm-dash-radius);
	margin: 0 0 22px;
	color: var(--rtwapwcm-dash-ink);
}
.rtwapwcm_dash_block_head { padding: var(--rtwapwcm-dash-pad) var(--rtwapwcm-dash-pad) 4px; }
.rtwapwcm_dash_block_title {
	margin: 0 0 8px;
	font-size: var(--rtwapwcm-dash-title);
	line-height: 1.3;
	font-weight: 700;
	letter-spacing: -0.01em;
	color: var(--rtwapwcm-dash-ink);
}
.rtwapwcm_dash_block_note {
	margin: 0;
	font-size: var(--rtwapwcm-dash-small);
	line-height: 1.6;
	color: var(--rtwapwcm-dash-muted);
	max-width: 74ch;
}

/* ------------------------------------------------------------ offer cards */
/* Amount first, what it applies to second, what limits it third. */
.rtwapwcm_dash_offers {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	gap: var(--rtwapwcm-dash-gap);
	margin: 16px 0 0;
	padding: 0 var(--rtwapwcm-dash-pad);
	list-style: none;
}
.rtwapwcm_dash_offer {
	margin: 0;
	padding: 18px 18px 14px;
	border: 1px solid var(--rtwapwcm-dash-line);
	border-radius: 8px;
	background: var(--rtwapwcm-dash-surface);
	list-style: none;
}
.rtwapwcm_dash_offer_soon { background: var(--rtwapwcm-dash-raise); }
.rtwapwcm_dash_offer_soon .rtwapwcm_dash_offer_amount,
.rtwapwcm_dash_offer_soon .rtwapwcm_dash_offer_on { color: var(--rtwapwcm-dash-muted); }.rtwapwcm_dash_offer_amount {
	margin: 0;
	font-size: var(--rtwapwcm-dash-amount);
	line-height: 1.15;
	font-weight: 700;
	letter-spacing: -0.02em;
	font-variant-numeric: tabular-nums;
	overflow-wrap: anywhere;
}.rtwapwcm_dash_offer_on {
	margin: 12px 0 0;
	font-size: var(--rtwapwcm-dash-lead);
	line-height: 1.5;
	font-weight: 600;
	overflow-wrap: anywhere;
}
/* the standard rate is a sentence, not a card: it only fills the gaps */
/* the starting point, before the exceptions */
.rtwapwcm_dash_standard {
	margin: 16px var(--rtwapwcm-dash-pad) 0;
	padding: 14px 16px;
	border: 1px solid #cdd7ff;
	border-left: 4px solid var(--rtwapwcm-dash-accent);
	border-radius: 8px;
	background: var(--rtwapwcm-dash-accent-soft);
}
.rtwapwcm_dash_standard_head {
	margin: 0;
	font-size: var(--rtwapwcm-dash-lead);
	font-weight: 700;
	line-height: 1.4;
	color: var(--rtwapwcm-dash-ink);
	font-variant-numeric: tabular-nums;
}
.rtwapwcm_dash_standard_unit { font-weight: 400; font-size: var(--rtwapwcm-dash-small); color: var(--rtwapwcm-dash-muted); }
.rtwapwcm_dash_standard_note {
	margin: 3px 0 0;
	font-size: var(--rtwapwcm-dash-small);
	line-height: 1.5;
	color: var(--rtwapwcm-dash-muted);
}

/* ------------------------------------------------------------- level ladder */
.rtwapwcm_dash_levels {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: var(--rtwapwcm-dash-gap);
	margin: 16px 0 0;
	padding: 0 var(--rtwapwcm-dash-pad) var(--rtwapwcm-dash-pad);
	list-style: none;
	counter-reset: rtwapwcm-dash-level;
}
.rtwapwcm_dash_level {
	margin: 0;
	padding: 16px 18px;
	border: 1px solid var(--rtwapwcm-dash-line);
	border-radius: 8px;
	list-style: none;
	font-size: var(--rtwapwcm-dash-text);
}
.rtwapwcm_dash_level_current {
	border-color: var(--rtwapwcm-dash-accent);
	background: var(--rtwapwcm-dash-accent-soft);
	box-shadow: inset 3px 0 0 var(--rtwapwcm-dash-accent);
}
.rtwapwcm_dash_level_name {
	margin: 0 0 8px;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.3;
	overflow-wrap: anywhere;
}
.rtwapwcm_dash_level_reqs { font-size: var(--rtwapwcm-dash-text); }
.rtwapwcm_dash_level_rate {
	margin: 12px 0 0;
	padding-top: 10px;
	border-top: 1px solid var(--rtwapwcm-dash-line);
	font-size: var(--rtwapwcm-dash-small);
	line-height: 1.55;
	color: var(--rtwapwcm-dash-muted);
	overflow-wrap: anywhere;
}
.rtwapwcm_dash_level_rate_label {
	display: block;
	font-size: var(--rtwapwcm-dash-micro);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
	margin-bottom: 2px;
}
.rtwapwcm_dash_level_current .rtwapwcm_dash_level_rate { border-top-color: #cdd7ff; }

/* ------------------------------------------------------------------ shared */
.rtwapwcm_dash_chip {
	display: inline-block;
	margin: 0 6px 0 0;
	padding: 3px 10px;
	border-radius: 12px;
	font-size: var(--rtwapwcm-dash-micro);
	font-weight: 600;
	line-height: 18px;
	background: #f0f1f3;
	color: var(--rtwapwcm-dash-muted);
	vertical-align: middle;
}
.rtwapwcm_dash_level_name .rtwapwcm_dash_chip { margin-left: 6px; }
.rtwapwcm_dash_chip_you,
.rtwapwcm_dash_chip_current,
.rtwapwcm_dash_chip_level_mine,
.rtwapwcm_dash_chip_group { background: var(--rtwapwcm-dash-accent-soft); color: var(--rtwapwcm-dash-accent); }
.rtwapwcm_dash_chip_soon {
	background: var(--rtwapwcm-dash-warn-soft);
	color: var(--rtwapwcm-dash-warn);
	border: 1px solid #e8d08a;
	font-weight: 700;
}

.rtwapwcm_dash_match {
	display: block;
	font-size: var(--rtwapwcm-dash-micro);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .05em;
	color: var(--rtwapwcm-dash-muted);
	margin-bottom: 5px;
}
.rtwapwcm_dash_conds,
.rtwapwcm_dash_facts { margin: 0; padding: 0; list-style: none; }
.rtwapwcm_dash_conds li,
.rtwapwcm_dash_facts li {
	position: relative;
	padding: 0 0 0 14px;
	margin: 0 0 3px;
	line-height: 1.5;
	overflow-wrap: anywhere;
}
.rtwapwcm_dash_conds li:before,
.rtwapwcm_dash_facts li:before {
	content: "";
	position: absolute;
	left: 0;
	top: .62em;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #c7ccd6;
}
.rtwapwcm_dash_conds li:last-child,
.rtwapwcm_dash_facts li:last-child { margin-bottom: 0; }

/* details: a real control, so it opens with a keyboard and with a tap */
.rtwapwcm_dash_details { margin: 12px 0 0; font-size: var(--rtwapwcm-dash-small); }
.rtwapwcm_dash_details_head {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 4px 2px;
	min-height: 24px;
	color: var(--rtwapwcm-dash-muted);
	font-weight: 600;
	cursor: pointer;
	list-style: none;
}
.rtwapwcm_dash_details_head:hover,
.rtwapwcm_dash_details[open] > .rtwapwcm_dash_details_head { color: var(--rtwapwcm-dash-accent); }
.rtwapwcm_dash_details_head::-webkit-details-marker { display: none; }
.rtwapwcm_dash_details_head:before { content: "\25b8"; font-size: 10px; }
.rtwapwcm_dash_details[open] > .rtwapwcm_dash_details_head:before { content: "\25be"; }
.rtwapwcm_dash_details_head:focus-visible { outline: 2px solid var(--rtwapwcm-dash-accent); outline-offset: 2px; border-radius: 3px; }
.rtwapwcm_dash_details_body {
	margin-top: 6px;
	padding: 10px 12px;
	border-radius: 6px;
	background: var(--rtwapwcm-dash-raise);
	color: var(--rtwapwcm-dash-muted);
	line-height: 1.6;
}
.rtwapwcm_dash_details_body p { margin: 0 0 8px; }
.rtwapwcm_dash_facts_head { font-weight: 600; color: var(--rtwapwcm-dash-ink); }
.rtwapwcm_dash_details_body p:last-child { margin-bottom: 0; }
/* details under a restriction open in normal flow, across the block's width */
.rtwapwcm_dash_details_inline { display: block; margin: 8px 0 0; }
.rtwapwcm_dash_details_block { margin: 4px var(--rtwapwcm-dash-pad) var(--rtwapwcm-dash-pad); }

.rtwapwcm_dash_level_shared {
	margin: 0;
	padding: 0 var(--rtwapwcm-dash-pad) var(--rtwapwcm-dash-pad);
	font-size: var(--rtwapwcm-dash-small);
	line-height: 1.55;
	color: var(--rtwapwcm-dash-muted);
}
.rtwapwcm_dash_goto {
	display: inline-block;
	color: var(--rtwapwcm-dash-accent);
	font-weight: 600;
	text-decoration: underline;
}
.rtwapwcm_dash_goto:focus-visible { outline: 2px solid var(--rtwapwcm-dash-accent); outline-offset: 2px; }

/* ------------------------------------------------------------ bonus table */
.rtwapwcm_dash_table_wrap { overflow-x: auto; }
.rtwapwcm_dash_table { width: 100%; border-collapse: collapse; font-size: var(--rtwapwcm-dash-text); margin-top: 14px; }
.rtwapwcm_dash_table th,
.rtwapwcm_dash_table td {
	text-align: left;
	padding: 14px 16px;
	border-top: 1px solid var(--rtwapwcm-dash-line);
	vertical-align: top;
}
.rtwapwcm_dash_table thead th {
	font-size: var(--rtwapwcm-dash-micro);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--rtwapwcm-dash-muted);
	background: var(--rtwapwcm-dash-raise);
	white-space: nowrap;
}
.rtwapwcm_dash_table tbody tr:hover { background: #fcfcfd; }
.rtwapwcm_dash_name { display: block; font-weight: 600; line-height: 1.4; overflow-wrap: anywhere; }
.rtwapwcm_dash_amount { font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.rtwapwcm_dash_amount_unknown { white-space: normal; font-weight: 600; color: var(--rtwapwcm-dash-muted); }
.rtwapwcm_dash_per { display: block; margin-top: 4px; color: var(--rtwapwcm-dash-muted); font-size: var(--rtwapwcm-dash-small); font-weight: 400; line-height: 1.45; white-space: normal; }
.rtwapwcm_dash_muted { color: var(--rtwapwcm-dash-muted); }

.rtwapwcm_dash_status {
	display: inline-block;
	padding: 4px 11px;
	border-radius: 4px;
	font-size: var(--rtwapwcm-dash-small);
	font-weight: 600;
	line-height: 1.5;
	background: #f0f1f3;
	color: var(--rtwapwcm-dash-muted);
	/* a pill that wraps looks like a broken box, so it stays on one line and the table
	   wrapper scrolls instead; the phone layout below lets it wrap again, where the row
	   is a block and there is nothing to scroll */
	white-space: nowrap;
}
.rtwapwcm_dash_status_pending { background: var(--rtwapwcm-dash-warn-soft); color: var(--rtwapwcm-dash-warn); }
.rtwapwcm_dash_status_approved { background: #e6f4ea; color: #1e6b32; }
.rtwapwcm_dash_status_paid { background: #e5f1fb; color: #0a4b78; }
.rtwapwcm_dash_status_review { background: var(--rtwapwcm-dash-warn-soft); color: var(--rtwapwcm-dash-warn); }
.rtwapwcm_dash_status_rejected { background: #fbeaea; color: #8a1f11; }
.rtwapwcm_dash_status_historic,
.rtwapwcm_dash_status_unknown { background: #eef0f3; color: #4b5563; }

.rtwapwcm_dash_empty {
	margin: 0;
	padding: 6px var(--rtwapwcm-dash-pad) var(--rtwapwcm-dash-pad);
	color: var(--rtwapwcm-dash-muted);
	font-size: var(--rtwapwcm-dash-text);
}
.rtwapwcm_overview_card_value_note { font-size: 15px; line-height: 1.35; display: block; }
.rtwapwcm_overview_card_hint { display: block; margin-top: 4px; font-size: 11px; line-height: 1.4; opacity: .85; }
.rtwapwcm_overview_card_hint .rtwapwcm_dash_goto { font-size: inherit; }

/* template two runs on a lighter surface: the blocks follow it rather than sit on it */
.rtwapwcm_dash_layout_two { --rtwapwcm-dash-radius: 8px; --rtwapwcm-dash-pad: 18px; --rtwapwcm-dash-title: 18px; }

/* ---------------------------------------------------------------- mobile */
@media screen and (max-width: 782px) {
	.rtwapwcm_dash_block { --rtwapwcm-dash-pad: 16px; --rtwapwcm-dash-title: 18px; --rtwapwcm-dash-amount: 27px; }
	.rtwapwcm_dash_offers,
	.rtwapwcm_dash_levels { grid-template-columns: 1fr; gap: 12px; }
	.rtwapwcm_dash_standard { margin-left: var(--rtwapwcm-dash-pad); margin-right: var(--rtwapwcm-dash-pad); padding: 12px 14px; }
	.rtwapwcm_dash_offer { padding: 15px 16px 12px; }
	.rtwapwcm_dash_offer_on { margin-top: 10px; }
	.rtwapwcm_dash_details { margin-top: 10px; }
	.rtwapwcm_dash_level { padding: 14px 16px; }
	.rtwapwcm_dash_table,
	.rtwapwcm_dash_table tbody,
	.rtwapwcm_dash_table tr,
	.rtwapwcm_dash_table td { display: block; width: 100%; }
	.rtwapwcm_dash_table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
	.rtwapwcm_dash_table tbody tr { border-top: 1px solid var(--rtwapwcm-dash-line); padding: 6px 0; }
	.rtwapwcm_dash_table td { border-top: 0; padding: 6px var(--rtwapwcm-dash-pad); }
	.rtwapwcm_dash_table td:before {
		content: attr(data-rtwapwcm-label);
		display: block;
		font-size: var(--rtwapwcm-dash-micro);
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: .05em;
		color: var(--rtwapwcm-dash-muted);
		margin-bottom: 3px;
	}
	.rtwapwcm_dash_table td:empty { display: none; }
	.rtwapwcm_dash_amount { white-space: normal; }
	.rtwapwcm_dash_status { white-space: normal; }
}

@media (prefers-reduced-motion: reduce) {
	.rtwapwcm_dash_block *,
	.rtwapwcm_dash_block *:before,
	.rtwapwcm_dash_block *:after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}

/* ==========================================================================
   3.0.0 dashboard UX pass: block eyebrows, layout accents, the level rail,
   the level badge and Affiliate Tools → Referral Discounts.
   The accent follows each layout's own brand: template one's navigation
   blue, template two's primary colour.
   ========================================================================== */
.rtwapwcm_dash_layout_one {
	/* template one's blocks follow its two brand tokens (set in the template-one stylesheet, which
	   template two never loads); the literals are the defaults */
	--rtwapwcm-dash-accent: var(--rtwapwcm-template1-primary, #1966a4);
	--rtwapwcm-dash-accent-soft: var(--rtwapwcm-template1-primary-soft, #e9f1f9);
	--rtwapwcm-dash-accent-line: var(--rtwapwcm-template1-primary-line, #bcd3e8);
}
.rtwapwcm_dash_layout_two {
	--rtwapwcm-dash-accent: var(--primary-color, #384c6d);
	--rtwapwcm-dash-accent-soft: #eef1f6;
	--rtwapwcm-dash-accent-line: #c8d1de;
	--rtwapwcm-dash-radius: 12px;
}
.rtwapwcm_dash_block { box-shadow: 0 1px 2px rgba(16, 24, 40, .04); }
.rtwapwcm_dash_block_head { padding-bottom: 6px; }
.rtwapwcm_dash_block_kind {
	display: block;
	margin: 0 0 6px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--rtwapwcm-dash-accent);
}
.rtwapwcm_dash_block_title { font-size: 22px; letter-spacing: -.015em; }
.rtwapwcm_dash_layout_two .rtwapwcm_dash_block_title { font-size: 20px; }
.rtwapwcm_dash_block_note { font-size: var(--rtwapwcm-dash-text); }

/* offer cards: a rule on top in the block's accent, the amount first */
.rtwapwcm_dash_offer {
	border-top: 3px solid var(--rtwapwcm-dash-accent);
	border-radius: 10px;
	transition: box-shadow .18s ease;
}
.rtwapwcm_dash_offer:hover { box-shadow: 0 6px 18px rgba(16, 24, 40, .08); }
.rtwapwcm_dash_offer_soon { border-top-color: #e8d08a; }
.rtwapwcm_dash_standard { border-color: var(--rtwapwcm-dash-accent-line); border-left-width: 4px; }
.rtwapwcm_dash_standard_head { font-size: 17px; }
.rtwapwcm_dash_chip_you,
.rtwapwcm_dash_chip_current,
.rtwapwcm_dash_chip_level_mine,
.rtwapwcm_dash_chip_group { border: 1px solid var(--rtwapwcm-dash-accent-line); }

/* the level rail: levels are an ordered ladder, so each step carries its number;
   the affiliate's own step is the filled one */
.rtwapwcm_dash_level {
	position: relative;
	padding: 18px 18px 16px 60px;
	border-radius: 10px;
}
.rtwapwcm_dash_level:before {
	counter-increment: rtwapwcm-dash-level;
	content: counter(rtwapwcm-dash-level);
	position: absolute;
	left: 18px;
	top: 17px;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	border: 2px solid var(--rtwapwcm-dash-line);
	background: #fff;
	color: var(--rtwapwcm-dash-muted);
	font-size: 13px;
	font-weight: 700;
	line-height: 24px;
	text-align: center;
	font-variant-numeric: tabular-nums;
}
.rtwapwcm_dash_level_current {
	border-color: var(--rtwapwcm-dash-accent);
	box-shadow: 0 0 0 1px var(--rtwapwcm-dash-accent);
}
.rtwapwcm_dash_level_current:before {
	background: var(--rtwapwcm-dash-accent);
	border-color: var(--rtwapwcm-dash-accent);
	color: #fff;
}
.rtwapwcm_dash_level_name { font-size: 18px; }

/* bonus table: readable rows, chips for status */
.rtwapwcm_dash_table tbody tr:nth-child(even) { background: #fbfbfc; }
.rtwapwcm_dash_status { border-radius: 999px; padding: 4px 12px; }

/* ------------------------------------------------------------- level badge */
/* A compact status chip that sits on the name line of each template: star, level name, chevron.
   "Affiliate level" stays in the accessible name and tooltip rather than on screen. */
.rtwapwcm_level_badge {
	--rtwapwcm-badge-accent: var(--rtwapwcm-template1-primary, #1966a4);
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin: 0;
	padding: 3px 9px 3px 6px;
	border: 1px solid #d9dee6;
	border-radius: 999px;
	background: #fff;
	color: #1d2327;
	font-size: 12.5px;
	font-weight: 700;
	line-height: 18px;
	letter-spacing: -.01em;
	text-decoration: none !important;
	vertical-align: middle;
	white-space: nowrap;
	box-shadow: 0 1px 2px rgba(16, 24, 40, .06);
	cursor: pointer;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.rtwapwcm_level_badge:hover,
.rtwapwcm_level_badge:focus-visible { border-color: var(--rtwapwcm-badge-accent); box-shadow: 0 2px 8px rgba(16, 24, 40, .10); color: #1d2327; }
.rtwapwcm_level_badge:focus-visible { outline: 2px solid var(--rtwapwcm-badge-accent); outline-offset: 2px; }
.rtwapwcm_level_badge_icon {
	display: inline-flex;
	flex: none;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	align-items: center;
	justify-content: center;
	background: linear-gradient(135deg, #f7e6ad, #d9a441);
	color: #6b4a00;
}
.rtwapwcm_level_badge_name { color: #1d2327; }
.rtwapwcm_level_badge_label {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}
.rtwapwcm_level_badge_chev { display: inline-flex; color: #8a93a3; }
.rtwapwcm_level_badge:hover .rtwapwcm_level_badge_chev { color: var(--rtwapwcm-badge-accent); }
/* template one: name and badge on one line in the content header */
.rtwapwcm_header_name_row { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 12px; }
.rtwapwcm_header_name_row h3.rtwapwcm_header_title { margin: 0; }
/* template two: the drawer is narrow, so the badge follows the name and may wrap under it */
.rtwapwcm_drawer_name_row { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 6px 10px; }
.rtwapwcm_drawer_name_row h4.rtwapwcm-title { margin: 0; }
.mdc-drawer__header .rtwapwcm_level_badge { --rtwapwcm-badge-accent: var(--primary-color, #384c6d); }
.rtwapwcm_dash_block:focus,
#rtwapwcm_dash_levels:focus { outline: 2px solid var(--rtwapwcm-dash-accent, #1966a4); outline-offset: 4px; }
/* template one's dropdown was sized for two-word labels */
.rtwapwcm_header_menu ul.rtwapwcm_dropdown_menu { width: auto; min-width: 176px; white-space: nowrap; }

/* -------------------------------------------------- referral discounts tab */
.rtwapwcm_rd_steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
	margin: 14px 0 0;
	padding: 0 var(--rtwapwcm-dash-pad);
	list-style: none;
}
.rtwapwcm_rd_steps li {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	margin: 0;
	padding: 12px 14px;
	border-radius: 10px;
	background: var(--rtwapwcm-dash-raise);
	font-size: var(--rtwapwcm-dash-small);
	line-height: 1.5;
	color: var(--rtwapwcm-dash-ink);
	list-style: none;
}
.rtwapwcm_rd_step_n {
	flex: none;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--rtwapwcm-dash-accent);
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	line-height: 24px;
	text-align: center;
}
.rtwapwcm_rd_methods {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--rtwapwcm-dash-gap);
	margin: 18px 0 0;
	padding: 0 var(--rtwapwcm-dash-pad) var(--rtwapwcm-dash-pad);
}
.rtwapwcm_rd_methods_two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rtwapwcm_rd_method {
	margin: 0;
	padding: 18px 18px 16px;
	border: 1px solid var(--rtwapwcm-dash-line);
	border-top: 3px solid var(--rtwapwcm-dash-accent);
	border-radius: 10px;
	background: #fff;
}
.rtwapwcm_rd_method_coupon { border-top-color: #d9a441; }
.rtwapwcm_rd_method_head { margin: 0 0 12px; }
.rtwapwcm_rd_method_kind {
	display: block;
	margin: 0 0 4px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--rtwapwcm-dash-muted);
}
.rtwapwcm_rd_method_title { margin: 0; font-size: 17px; font-weight: 700; line-height: 1.3; color: var(--rtwapwcm-dash-ink); }
.rtwapwcm_rd_amount {
	margin: 0;
	font-size: 28px;
	font-weight: 700;
	letter-spacing: -.02em;
	line-height: 1.15;
	font-variant-numeric: tabular-nums;
	color: var(--rtwapwcm-dash-ink);
	overflow-wrap: anywhere;
}
.rtwapwcm_rd_amount_text { font-size: 20px; }
.rtwapwcm_rd_text,
.rtwapwcm_rd_muted { margin: 8px 0 0; font-size: var(--rtwapwcm-dash-small); line-height: 1.55; color: var(--rtwapwcm-dash-muted); }
.rtwapwcm_rd_muted { font-size: var(--rtwapwcm-dash-micro); }
.rtwapwcm_rd_empty {
	margin: 6px 0 0;
	padding: 12px 14px;
	border-radius: 8px;
	background: var(--rtwapwcm-dash-raise);
	font-size: var(--rtwapwcm-dash-small);
	line-height: 1.55;
	color: var(--rtwapwcm-dash-muted);
}
.rtwapwcm_rd_actions { margin: 14px 0 0; }
.rtwapwcm_rd_button {
	display: inline-block;
	padding: 9px 16px;
	border-radius: 8px;
	background: var(--rtwapwcm-dash-accent);
	color: #fff !important;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
	text-decoration: none !important;
	transition: filter .15s ease;
}
.rtwapwcm_rd_button:hover { filter: brightness(1.08); }
.rtwapwcm_rd_button:focus-visible { outline: 2px solid var(--rtwapwcm-dash-accent); outline-offset: 2px; }
.rtwapwcm_rd_coupons { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.rtwapwcm_rd_coupon { margin: 0; padding: 14px 0 0; border-top: 1px dashed #d9dee6; list-style: none; }
.rtwapwcm_rd_coupon:first-child { border-top: 0; padding-top: 0; }
.rtwapwcm_rd_code_row { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.rtwapwcm_rd_code {
	display: inline-block;
	padding: 8px 14px;
	border: 1.5px dashed var(--rtwapwcm-dash-accent);
	border-radius: 8px;
	background: var(--rtwapwcm-dash-accent-soft);
	color: var(--rtwapwcm-dash-ink);
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: .06em;
	overflow-wrap: anywhere;
}
.rtwapwcm_rd_copy {
	appearance: none;
	-webkit-appearance: none;
	margin: 0;
	padding: 8px 12px;
	border: 1px solid var(--rtwapwcm-dash-accent);
	border-radius: 8px;
	background: #fff;
	color: var(--rtwapwcm-dash-accent);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	transition: background .15s ease, color .15s ease;
}
.rtwapwcm_rd_copy:hover { background: var(--rtwapwcm-dash-accent-soft); }
.rtwapwcm_rd_copy:focus-visible { outline: 2px solid var(--rtwapwcm-dash-accent); outline-offset: 2px; }
.rtwapwcm_rd_copy.rtwapwcm_rd_copied,
.rtwapwcm_rd_copy.rtwapwcm_rd_copied:hover { background: #1e6b32; border-color: #1e6b32; color: #fff; }
.rtwapwcm_rd_coupon .rtwapwcm_rd_amount { margin-top: 10px; font-size: 22px; }
.rtwapwcm_rd_terms { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 0; padding: 0; list-style: none; }
.rtwapwcm_rd_terms li {
	margin: 0;
	padding: 3px 10px;
	border-radius: 999px;
	background: #f0f1f3;
	color: var(--rtwapwcm-dash-muted);
	font-size: 12px;
	font-weight: 600;
	line-height: 18px;
	list-style: none;
}

/* chart facts under the link-conversion gauge */
.rtwapwcm_chart_facts { margin: 8px 0 0; padding: 0; list-style: none; font-size: 14px; }
.rtwapwcm_chart_facts li { display: flex; justify-content: space-between; gap: 12px; margin: 0; padding: 7px 0; border-top: 1px solid #eef0f3; }
.rtwapwcm_chart_facts li .rtwapwcm_float_right { float: none; font-weight: 700; font-variant-numeric: tabular-nums; }

@media screen and (max-width: 782px) {
	.rtwapwcm_rd_steps,
	.rtwapwcm_rd_methods_two { grid-template-columns: 1fr; }
	.rtwapwcm_rd_amount { font-size: 24px; }
	.rtwapwcm_rd_method { padding: 15px 16px 14px; }
	.rtwapwcm_dash_level { padding-left: 56px; }
	.rtwapwcm_dash_level:before { left: 16px; }
	.rtwapwcm_dash_block_title { font-size: 20px; }
	#rtwapwcm_header .rtwapwcm_level_badge { margin-top: 8px; }
}
@media (prefers-reduced-motion: reduce) {
	.rtwapwcm_level_badge,
	.rtwapwcm_rd_button,
	.rtwapwcm_rd_copy,
	.rtwapwcm_dash_offer { transition: none; }
}

/* ==========================================================================
   Commission tab, polished (3.0.0): one system, two identities.
   Template one is a ledger — white surfaces, hairline rows, its navigation
   blue as the single accent. Template two follows its own soft-card system —
   the configured primary colour for structure, the secondary colour only on
   the small "live" marks (icon discs, the current-level chip, the top rule of
   an opportunity), tints mixed from those two colours so a merchant's palette
   carries through.
   ========================================================================== */
.rtwapwcm_dash_layout_one {
	--rtwapwcm-dash-accent-ink: var(--rtwapwcm-template1-primary-ink, #14507f);
	--rtwapwcm-dash-second: var(--rtwapwcm-template1-secondary, #6f52b5);
	--rtwapwcm-dash-second-ink: var(--rtwapwcm-template1-secondary-ink, #56408d);
	--rtwapwcm-dash-second-soft: var(--rtwapwcm-template1-secondary-soft, #f1eef8);
	--rtwapwcm-dash-band: #f3f7fb;
	--rtwapwcm-dash-disc: var(--rtwapwcm-template1-primary, #1966a4);
	--rtwapwcm-dash-card-shadow: 0 1px 2px rgba(16, 24, 40, .04);
	--rtwapwcm-dash-card-hover: 0 8px 22px rgba(16, 24, 40, .12);
}
@supports (background: color-mix(in srgb, red 10%, white)) {
	.rtwapwcm_dash_layout_one { --rtwapwcm-dash-band: color-mix(in srgb, var(--rtwapwcm-template1-primary, #1966a4) 5%, white); }
}
/* template one, secondary colour: the supporting marks — "for you / your group / your level" chips,
   the coupon method's rule. Primary stays on structure and actions; statuses keep fixed colours. */
.rtwapwcm_dash_layout_one .rtwapwcm_dash_chip_you,
.rtwapwcm_dash_layout_one .rtwapwcm_dash_chip_level_mine,
.rtwapwcm_dash_layout_one .rtwapwcm_dash_chip_group { background: var(--rtwapwcm-dash-second-soft); color: var(--rtwapwcm-dash-second-ink); border-color: var(--rtwapwcm-dash-second-soft); }
.rtwapwcm_dash_layout_one .rtwapwcm_rd_method_coupon { border-top-color: var(--rtwapwcm-dash-second); }
.rtwapwcm_dash_layout_two {
	--rtwapwcm-dash-accent-ink: var(--primary-color, #384c6d);
	--rtwapwcm-dash-second: var(--secondary-color, #cb0c9f);
	--rtwapwcm-dash-second-soft: #fbeaf6;
	--rtwapwcm-dash-band: #f5f7fb;
	--rtwapwcm-dash-disc: linear-gradient(310deg, var(--primary-color, #384c6d), var(--secondary-color, #cb0c9f) 60%);
	--rtwapwcm-dash-card-shadow: 0 .25rem .375rem -.0625rem hsl(0deg 0% 8% / 12%), 0 .125rem .25rem -.0625rem hsl(0deg 0% 8% / 7%);
	--rtwapwcm-dash-card-hover: 0 .5rem 1rem -.25rem hsl(0deg 0% 8% / 18%);
	--rtwapwcm-dash-line: #e6eaf0;
	border: 0;
	box-shadow: var(--rtwapwcm-dash-card-shadow);
}
@supports (background: color-mix(in srgb, red 10%, white)) {
	.rtwapwcm_dash_layout_two {
		--rtwapwcm-dash-accent-soft: color-mix(in srgb, var(--primary-color, #384c6d) 8%, white);
		--rtwapwcm-dash-accent-line: color-mix(in srgb, var(--primary-color, #384c6d) 28%, white);
		--rtwapwcm-dash-second-soft: color-mix(in srgb, var(--secondary-color, #cb0c9f) 9%, white);
		--rtwapwcm-dash-band: color-mix(in srgb, var(--primary-color, #384c6d) 5%, white);
	}
}
.rtwapwcm_dash_layout_two .rtwapwcm_dash_amount,
.rtwapwcm_dash_layout_two .rtwapwcm_dash_offer_amount,
.rtwapwcm_dash_layout_two .rtwapwcm_dash_standard_head,
.rtwapwcm_dash_layout_two .rtwapwcm_dash_block_title,
.rtwapwcm_dash_layout_two .rtwapwcm_dash_level_name { color: var(--rtwapwcm-dash-accent-ink); }
.rtwapwcm_dash_layout_two .rtwapwcm_dash_block_kind { color: var(--rtwapwcm-dash-second); }
.rtwapwcm_dash_layout_two .rtwapwcm_dash_block_head { padding-top: 22px; }

/* ------------------------------------------------------------ section heads */
/* icon disc + title + one line: the same head for rates, opportunities and dates */
.rtwapwcm_dash_section_head {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 0 0 14px;
}
.rtwapwcm_dash_section_icon {
	display: inline-flex;
	flex: none;
	width: 36px;
	height: 36px;
	border-radius: 10px;
	align-items: center;
	justify-content: center;
	background: var(--rtwapwcm-dash-disc);
	color: #fff;
	box-shadow: 0 2px 6px rgba(16, 24, 40, .12);
}
.rtwapwcm_dash_section_icon svg { width: 18px; height: 18px; }
.rtwapwcm_dash_section_text { min-width: 0; padding-top: 2px; }
.rtwapwcm_dash_sub_title {
	margin: 0;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: -.005em;
	line-height: 1.3;
	text-transform: none;
	color: var(--rtwapwcm-dash-ink);
}
.rtwapwcm_dash_layout_two .rtwapwcm_dash_sub_title { color: var(--rtwapwcm-dash-accent-ink); }
.rtwapwcm_dash_sub_note {
	margin: 3px 0 0;
	font-size: var(--rtwapwcm-dash-small);
	line-height: 1.5;
	color: var(--rtwapwcm-dash-muted);
	max-width: 70ch;
}

/* ------------------------------------------------------------- standard rate */
.rtwapwcm_dash_standard {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 14px;
	margin: 18px var(--rtwapwcm-dash-pad) 0;
	padding: 14px 18px;
	border: 1px solid var(--rtwapwcm-dash-accent-line);
	border-left: 4px solid var(--rtwapwcm-dash-accent);
	border-radius: 10px;
	background: var(--rtwapwcm-dash-accent-soft);
}
.rtwapwcm_dash_standard_head { flex: 1 1 260px; margin: 0; font-size: 17px; }
.rtwapwcm_dash_standard_note { flex: 1 1 100%; margin: 0; }

/* ------------------------------------------------------------- rate tables */
.rtwapwcm_dash_rates {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--rtwapwcm-dash-gap);
	margin: 18px 0 0;
	padding: 0 var(--rtwapwcm-dash-pad);
}
.rtwapwcm_dash_rates_two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rtwapwcm_dash_rate_card {
	min-width: 0;
	padding: 16px 16px 4px;
	border: 1px solid var(--rtwapwcm-dash-line);
	border-radius: 12px;
	background: #fff;
	box-shadow: var(--rtwapwcm-dash-card-shadow);
}
.rtwapwcm_dash_rate_card .rtwapwcm_dash_section_head { margin-bottom: 10px; }
.rtwapwcm_dash_rate_card .rtwapwcm_dash_section_icon { width: 30px; height: 30px; border-radius: 8px; box-shadow: none; }
.rtwapwcm_dash_rate_card .rtwapwcm_dash_section_icon svg { width: 15px; height: 15px; }
.rtwapwcm_dash_rate_card .rtwapwcm_dash_table { margin-top: 0; }
.rtwapwcm_dash_rate_card .rtwapwcm_dash_table thead th { background: transparent; border-top: 0; border-bottom: 1px solid var(--rtwapwcm-dash-line); padding: 6px 8px 8px; font-size: 11px; letter-spacing: .1em; }
.rtwapwcm_dash_rate_card .rtwapwcm_dash_table td { padding: 12px 8px; border-top: 1px solid var(--rtwapwcm-dash-line); }
.rtwapwcm_dash_rate_card .rtwapwcm_dash_table tbody tr:first-child td { border-top: 0; }
.rtwapwcm_dash_rate_card .rtwapwcm_dash_table tbody tr:nth-child(even) { background: transparent; }
.rtwapwcm_dash_rate_card .rtwapwcm_dash_table tbody tr:hover { background: var(--rtwapwcm-dash-raise); }
.rtwapwcm_dash_rate_card .rtwapwcm_dash_table th:last-child,
.rtwapwcm_dash_rate_card .rtwapwcm_dash_table td:last-child { text-align: right; white-space: nowrap; }
.rtwapwcm_dash_rate_table .rtwapwcm_dash_name { font-size: var(--rtwapwcm-dash-text); }
.rtwapwcm_dash_rate_table .rtwapwcm_dash_amount { font-size: 18px; letter-spacing: -.01em; }
.rtwapwcm_dash_rate_table .rtwapwcm_dash_per { margin-top: 1px; font-size: var(--rtwapwcm-dash-micro); }
.rtwapwcm_dash_rate_title { display: block; margin-top: 2px; font-size: var(--rtwapwcm-dash-micro); color: var(--rtwapwcm-dash-muted); }
.rtwapwcm_dash_rate_except {
	display: inline-block;
	margin-top: 5px;
	padding: 2px 8px;
	border-radius: 999px;
	background: var(--rtwapwcm-dash-warn-soft);
	color: var(--rtwapwcm-dash-warn);
	font-size: var(--rtwapwcm-dash-micro);
	font-weight: 600;
	line-height: 16px;
}
.rtwapwcm_dash_rate_meta { display: block; margin-top: 5px; }
.rtwapwcm_dash_rate_meta .rtwapwcm_dash_chip { margin: 0 6px 4px 0; }

/* ------------------------------------------- special opportunities: a band */
/* The band is what tells a conditional offer from a plain rate: tinted ground,
   white cards, the accent disc on the head. */
.rtwapwcm_dash_special {
	margin: 22px var(--rtwapwcm-dash-pad) 0;
	padding: 18px 18px 18px;
	border: 1px solid var(--rtwapwcm-dash-accent-line);
	border-radius: 12px;
	background: var(--rtwapwcm-dash-band);
}
.rtwapwcm_dash_layout_two .rtwapwcm_dash_special { border: 0; box-shadow: inset 0 3px 0 0 transparent; background-image: linear-gradient(90deg, var(--primary-color, #384c6d), var(--secondary-color, #cb0c9f)); background-size: 100% 3px; background-repeat: no-repeat; background-color: var(--rtwapwcm-dash-band); border-radius: 12px; }
.rtwapwcm_dash_special .rtwapwcm_dash_offers,
.rtwapwcm_dash_soon .rtwapwcm_dash_offers { margin-top: 0; padding: 0; }
.rtwapwcm_dash_offer {
	padding: 18px 18px 14px;
	border: 1px solid var(--rtwapwcm-dash-line);
	border-top: 3px solid var(--rtwapwcm-dash-accent);
	border-radius: 12px;
	background: #fff;
	box-shadow: var(--rtwapwcm-dash-card-shadow);
	transition: box-shadow .18s ease, transform .18s ease;
}
.rtwapwcm_dash_offer:hover { box-shadow: var(--rtwapwcm-dash-card-hover); transform: translateY(-1px); }
.rtwapwcm_dash_layout_two .rtwapwcm_dash_offer { border-top-color: var(--rtwapwcm-dash-second); }
.rtwapwcm_dash_offer_amount { color: var(--rtwapwcm-dash-ink); }
/* ---------------------------------------------- starting later: a dated band */
/* Not disabled, not an error: the same offer card, on a warm ground, with the
   date as the first thing the eye lands on. */
.rtwapwcm_dash_soon {
	margin: 18px var(--rtwapwcm-dash-pad) 0;
	padding: 18px;
	border: 1px solid #ecdcae;
	border-radius: 12px;
	background: #fdf8ec;
}
.rtwapwcm_dash_soon .rtwapwcm_dash_section_icon { background: #d9a441; color: #3d2a00; }
.rtwapwcm_dash_offer_soon { background: #fff; border-top-color: #d9a441; }
.rtwapwcm_dash_layout_two .rtwapwcm_dash_offer_soon { border-top-color: #d9a441; }
.rtwapwcm_dash_offer_soon .rtwapwcm_dash_offer_amount,
.rtwapwcm_dash_offer_soon .rtwapwcm_dash_offer_on { color: var(--rtwapwcm-dash-ink); }.rtwapwcm_dash_chip_soon {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 4px 10px 4px 8px;
	border: 1px solid #e8d08a;
	border-radius: 999px;
	background: var(--rtwapwcm-dash-warn-soft);
	color: var(--rtwapwcm-dash-warn);
	font-weight: 700;
}
.rtwapwcm_dash_chip_soon svg { width: 14px; height: 14px; }

/* --------------------------------------------------- commission rules to know */
/* A compact information panel: two things worth knowing, each with its icon.
   Informational, never an alarm. */
.rtwapwcm_dash_rules {
	margin: 18px var(--rtwapwcm-dash-pad) var(--rtwapwcm-dash-pad);
	padding: 16px 18px 12px;
	border: 1px solid var(--rtwapwcm-dash-accent-line);
	border-left: 4px solid var(--rtwapwcm-dash-accent);
	border-radius: 12px;
	background: var(--rtwapwcm-dash-accent-soft);
}
.rtwapwcm_dash_rules_title {
	margin: 0 0 6px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--rtwapwcm-dash-accent);
}
.rtwapwcm_dash_layout_two .rtwapwcm_dash_rules_title { color: var(--rtwapwcm-dash-accent-ink); }
.rtwapwcm_dash_rules_list { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 4px 28px; }
.rtwapwcm_dash_rule_item {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	margin: 0;
	padding: 8px 0;
	list-style: none;
	min-width: 0;
}
.rtwapwcm_dash_rule_icon {
	display: inline-flex;
	flex: none;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	align-items: center;
	justify-content: center;
	background: #fff;
	color: var(--rtwapwcm-dash-accent);
	box-shadow: 0 1px 2px rgba(16, 24, 40, .08);
}
.rtwapwcm_dash_rule_excluded .rtwapwcm_dash_rule_icon { color: #8a1f11; }
.rtwapwcm_dash_rule_text { min-width: 0; padding-top: 3px; }
.rtwapwcm_dash_rule_title { margin: 0 0 3px; font-size: var(--rtwapwcm-dash-text); font-weight: 700; line-height: 1.35; color: var(--rtwapwcm-dash-ink); }
.rtwapwcm_dash_note { margin: 0; font-size: var(--rtwapwcm-dash-small); line-height: 1.5; color: var(--rtwapwcm-dash-muted); max-width: 60ch; }
.rtwapwcm_dash_exclusions { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 0; padding: 0; list-style: none; }
.rtwapwcm_dash_exclusions li {
	margin: 0;
	padding: 4px 10px;
	border: 1px solid var(--rtwapwcm-dash-line);
	border-radius: 999px;
	background: #fff;
	color: var(--rtwapwcm-dash-ink);
	font-size: var(--rtwapwcm-dash-small);
	font-weight: 600;
	line-height: 18px;
	list-style: none;
	overflow-wrap: anywhere;
}
.rtwapwcm_dash_block_commission > .rtwapwcm_dash_special:last-child,
.rtwapwcm_dash_block_commission > .rtwapwcm_dash_soon:last-child,
.rtwapwcm_dash_block_commission > .rtwapwcm_dash_rates:last-child { margin-bottom: var(--rtwapwcm-dash-pad); }

/* ---------------------------------------------------- levels: compare states */
/* Every state has a word and an icon in its chip; the card treatment repeats it:
   current is filled, next is outlined in green, achieved is quiet, locked is
   dimmed with a lock. */
.rtwapwcm_dash_level { background: #fff; box-shadow: var(--rtwapwcm-dash-card-shadow); border-radius: 12px; }
.rtwapwcm_dash_level_current { background: var(--rtwapwcm-dash-accent-soft); }
.rtwapwcm_dash_level_next { border-color: #8fd0a2; box-shadow: var(--rtwapwcm-dash-card-shadow), inset 0 0 0 1px #d6efdc; }
.rtwapwcm_dash_level_locked { opacity: 1; background: var(--rtwapwcm-dash-raise); }
.rtwapwcm_dash_level_locked:before { border-style: dashed; }
.rtwapwcm_dash_level_locked .rtwapwcm_dash_level_name,
.rtwapwcm_dash_level_locked .rtwapwcm_dash_level_benefits,
.rtwapwcm_dash_level_locked .rtwapwcm_dash_level_reqs { color: var(--rtwapwcm-dash-muted); }
.rtwapwcm_dash_level_achieved:before { background: #1e6b32; border-color: #1e6b32; color: #fff; }
.rtwapwcm_dash_chip_status { display: inline-flex; align-items: center; gap: 4px; margin-left: 6px; padding: 3px 9px 3px 7px; }
.rtwapwcm_dash_chip_status svg { width: 13px; height: 13px; }
.rtwapwcm_dash_chip_current { background: var(--rtwapwcm-dash-accent); color: #fff; border: 1px solid var(--rtwapwcm-dash-accent); }
.rtwapwcm_dash_layout_two .rtwapwcm_dash_chip_current { background: var(--rtwapwcm-dash-disc); border-color: transparent; }
.rtwapwcm_dash_chip_next { background: #e6f4ea; color: #1e6b32; border: 1px solid #b7e0c2; }
.rtwapwcm_dash_chip_achieved { background: #eef0f3; color: #1e6b32; border: 1px solid #d4dae3; }
.rtwapwcm_dash_chip_locked { background: #eef0f3; color: #5c6470; border: 1px solid #d4dae3; }

/* benefits and requirements inside a level card */
.rtwapwcm_dash_level_benefits { margin: 10px 0 0; padding: 10px 12px; border-radius: 8px; font-size: var(--rtwapwcm-dash-small); }
.rtwapwcm_dash_chip_start { margin-left: 6px; background: #f0f1f3; color: var(--rtwapwcm-dash-muted); border: 1px solid #d4dae3; }
.rtwapwcm_dash_benefit_list { margin: 4px 0 0; padding: 0; list-style: none; }
.rtwapwcm_dash_benefit {
	position: relative;
	margin: 0 0 4px;
	padding: 0 0 0 20px;
	line-height: 1.5;
	font-weight: 600;
	color: var(--rtwapwcm-dash-ink);
	list-style: none;
	overflow-wrap: anywhere;
}
.rtwapwcm_dash_benefit:before {
	content: "";
	position: absolute;
	left: 2px;
	top: .45em;
	width: 10px;
	height: 6px;
	border-left: 2px solid var(--rtwapwcm-dash-accent);
	border-bottom: 2px solid var(--rtwapwcm-dash-accent);
	transform: rotate(-45deg);
}
.rtwapwcm_dash_benefit_bonus:before { border-color: #b7791f; }
.rtwapwcm_dash_level_baseline,
.rtwapwcm_dash_level_none { margin: 6px 0 0; font-size: var(--rtwapwcm-dash-micro); line-height: 1.5; color: var(--rtwapwcm-dash-muted); }
.rtwapwcm_dash_level_none { font-size: var(--rtwapwcm-dash-small); color: var(--rtwapwcm-dash-ink); }
.rtwapwcm_dash_level_reqs { margin-top: 12px; }
.rtwapwcm_dash_level_reqs .rtwapwcm_dash_level_rate_label { margin-bottom: 4px; }
.rtwapwcm_dash_reqs { margin: 0; padding: 0; list-style: none; }
.rtwapwcm_dash_req { position: relative; margin: 0 0 8px; padding: 0 0 0 20px; font-size: var(--rtwapwcm-dash-small); line-height: 1.5; list-style: none; }
.rtwapwcm_dash_req:before {
	content: "";
	position: absolute;
	left: 1px;
	top: .35em;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	border: 2px solid #c7ccd6;
	box-sizing: border-box;
}
.rtwapwcm_dash_req_met:before { border-color: #1e6b32; background: #1e6b32; }
.rtwapwcm_dash_req_met:after {
	content: "";
	position: absolute;
	left: 4.5px;
	top: .55em;
	width: 5px;
	height: 3px;
	border-left: 2px solid #fff;
	border-bottom: 2px solid #fff;
	transform: rotate(-45deg);
}
.rtwapwcm_dash_req_text { display: inline; }
.rtwapwcm_dash_req_progress { display: inline-block; margin-left: 8px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--rtwapwcm-dash-ink); }
.rtwapwcm_dash_req_bar { display: block; height: 4px; margin-top: 5px; border-radius: 2px; background: #e4e7ec; overflow: hidden; }
.rtwapwcm_dash_req_bar > span { display: block; height: 100%; border-radius: 2px; background: var(--rtwapwcm-dash-accent); }
.rtwapwcm_dash_req_met .rtwapwcm_dash_req_bar > span { background: #1e6b32; }
.rtwapwcm_dash_level_shared { padding-top: 0; }
.rtwapwcm_dash_level_benefits { background: #fff; border: 1px solid var(--rtwapwcm-dash-line); }
.rtwapwcm_dash_level_current .rtwapwcm_dash_level_benefits { border-color: var(--rtwapwcm-dash-accent-line); }
.rtwapwcm_dash_level_locked .rtwapwcm_dash_benefit:before { border-color: #8a93a3; }

/* ----------------------------------------------------- bonuses: same table kit */
.rtwapwcm_dash_block_bonuses .rtwapwcm_dash_table_wrap { margin: 14px var(--rtwapwcm-dash-pad) var(--rtwapwcm-dash-pad); border: 1px solid var(--rtwapwcm-dash-line); border-radius: 12px; }
.rtwapwcm_dash_block_bonuses .rtwapwcm_dash_table { margin-top: 0; }
.rtwapwcm_dash_block_bonuses .rtwapwcm_dash_table thead th { border-top: 0; background: var(--rtwapwcm-dash-raise); font-size: 11px; letter-spacing: .1em; }
.rtwapwcm_dash_block_bonuses .rtwapwcm_dash_table thead th:first-child { border-top-left-radius: 12px; }
.rtwapwcm_dash_block_bonuses .rtwapwcm_dash_table thead th:last-child { border-top-right-radius: 12px; }
.rtwapwcm_dash_block_bonuses .rtwapwcm_dash_table tbody tr:nth-child(even) { background: transparent; }
.rtwapwcm_dash_block_bonuses .rtwapwcm_dash_table tbody tr:hover { background: var(--rtwapwcm-dash-raise); }
.rtwapwcm_dash_block_bonuses .rtwapwcm_dash_amount { font-size: 16px; }
.rtwapwcm_dash_layout_two .rtwapwcm_dash_status_approved { background: #e6f4ea; }

/* --------------------------------------------------------------- template two headings */
.rtwapwcm_wrapper .rtwapwcm_chart_header h5 { text-transform: none; }

/* ------------------------------------------------------------------ focus */
.rtwapwcm_dash_block a:focus-visible,
.rtwapwcm_dash_block summary:focus-visible { outline: 2px solid var(--rtwapwcm-dash-accent); outline-offset: 2px; border-radius: 4px; }

/* ------------------------------------------------------------------ narrow */
@media screen and (max-width: 782px) {
	.rtwapwcm_dash_rates_two { grid-template-columns: 1fr; }
	.rtwapwcm_dash_rate_card { padding: 14px 12px 2px; }
	.rtwapwcm_dash_rate_card .rtwapwcm_dash_table th:last-child,
	.rtwapwcm_dash_rate_card .rtwapwcm_dash_table td:last-child { text-align: left; white-space: normal; }
	.rtwapwcm_dash_rate_card .rtwapwcm_dash_table tbody tr { border-top: 1px solid var(--rtwapwcm-dash-line); padding: 8px 0; }
	.rtwapwcm_dash_rate_card .rtwapwcm_dash_table tbody tr:first-child { border-top: 0; }
	.rtwapwcm_dash_rate_card .rtwapwcm_dash_table td { padding: 4px 8px; border-top: 0; }
	.rtwapwcm_dash_rate_card .rtwapwcm_dash_table td:first-child:before { display: none; }
	.rtwapwcm_dash_special,
	.rtwapwcm_dash_soon { padding: 14px 12px; }
	.rtwapwcm_dash_rules { padding: 14px 14px 12px; }
	.rtwapwcm_dash_rules_list { grid-template-columns: 1fr; }
	.rtwapwcm_dash_section_head { gap: 10px; }
	.rtwapwcm_dash_standard { padding: 12px 14px; }
	.rtwapwcm_dash_header_name_row,
	.rtwapwcm_header_name_row { gap: 6px 10px; }
	.rtwapwcm_dash_offer:hover { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
	.rtwapwcm_dash_offer { transition: none; }
	.rtwapwcm_dash_offer:hover { transform: none; }
}

/* ==========================================================================
   Commission tab, usability pass (3.0.0): opportunities as compact rows, a
   quiet "all rules" control, the eligible list, and a centred details dialog
   built on the dashboard's own modal language (dimmed page, white card,
   round close). Template two keeps its colours through the same tokens.
   ========================================================================== */
/* ------------------------------------------------ opportunities: compact rows */
.rtwapwcm_dash_offers {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(380px, 1fr));
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.rtwapwcm_dash_special .rtwapwcm_dash_offers,
.rtwapwcm_dash_soon .rtwapwcm_dash_offers { margin-top: 0; padding: 0; }
.rtwapwcm_dash_offer {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: 14px;
	margin: 0;
	padding: 12px 14px;
	border: 1px solid var(--rtwapwcm-dash-line);
	border-top: 1px solid var(--rtwapwcm-dash-line);
	border-radius: 10px;
	background: #fff;
	box-shadow: var(--rtwapwcm-dash-card-shadow);
	list-style: none;
	transition: box-shadow .18s ease, border-color .18s ease;
}
.rtwapwcm_dash_offer:hover { box-shadow: var(--rtwapwcm-dash-card-hover); border-color: var(--rtwapwcm-dash-accent-line); transform: none; }
.rtwapwcm_dash_layout_two .rtwapwcm_dash_offer { border-top-color: var(--rtwapwcm-dash-line); }
/* the rate is the first thing: a tinted tile, tabular figures, never wider than it needs */
.rtwapwcm_dash_offer_rate {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-width: 62px;
	max-width: 120px;
	min-height: 44px;
	padding: 6px 10px;
	border-radius: 9px;
	background: var(--rtwapwcm-dash-accent-soft);
	color: var(--rtwapwcm-dash-accent-ink);
	text-align: center;
}
.rtwapwcm_dash_layout_two .rtwapwcm_dash_offer_rate { background: var(--rtwapwcm-dash-second-soft); color: var(--rtwapwcm-dash-accent-ink); }
.rtwapwcm_dash_offer_amount {
	margin: 0;
	font-size: 17px;
	line-height: 1.15;
	font-weight: 700;
	letter-spacing: -.02em;
	font-variant-numeric: tabular-nums;
	color: inherit;
	overflow-wrap: anywhere;
}
.rtwapwcm_dash_offer_qual { display: block; margin-top: 1px; font-size: 11px; line-height: 1.3; font-weight: 600; letter-spacing: 0; color: inherit; opacity: .85; }
.rtwapwcm_dash_offer_text { min-width: 0; }
.rtwapwcm_dash_offer_on {
	display: block;
	margin: 0;
	font-size: var(--rtwapwcm-dash-text);
	line-height: 1.4;
	font-weight: 600;
	color: var(--rtwapwcm-dash-ink);
	overflow-wrap: anywhere;
}
.rtwapwcm_dash_offer_sub { display: block; margin: 2px 0 0; font-size: var(--rtwapwcm-dash-small); line-height: 1.45; color: var(--rtwapwcm-dash-muted); overflow-wrap: anywhere; }
.rtwapwcm_dash_offer_meta { display: block; margin: 6px 0 0; }
.rtwapwcm_dash_offer_meta .rtwapwcm_dash_chip { margin: 0 6px 0 0; }
.rtwapwcm_dash_offer_link { white-space: nowrap; }
/* starting later: the same row on a warm ground, the date chip does the talking */
.rtwapwcm_dash_offer_soon { background: #fff; border-top-color: var(--rtwapwcm-dash-line); }
.rtwapwcm_dash_layout_two .rtwapwcm_dash_offer_soon { border-top-color: var(--rtwapwcm-dash-line); }
.rtwapwcm_dash_offer_soon .rtwapwcm_dash_offer_rate { background: var(--rtwapwcm-dash-warn-soft); color: var(--rtwapwcm-dash-warn); }
.rtwapwcm_dash_offer_soon .rtwapwcm_dash_offer_amount,
.rtwapwcm_dash_offer_soon .rtwapwcm_dash_offer_on { color: inherit; }
.rtwapwcm_dash_offer_soon .rtwapwcm_dash_offer_on { color: var(--rtwapwcm-dash-ink); }

/* ------------------------------------------------ the "all rules" control */
.rtwapwcm_dash_sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.rtwapwcm_dash_eligible {
	margin: 14px var(--rtwapwcm-dash-pad) var(--rtwapwcm-dash-pad);
	border: 1px solid var(--rtwapwcm-dash-line);
	border-radius: 10px;
	background: var(--rtwapwcm-dash-raise);
}
.rtwapwcm_dash_eligible_head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 14px 12px 16px; }
.rtwapwcm_dash_eligible_text { min-width: 0; }
.rtwapwcm_dash_eligible_title { margin: 0; font-size: var(--rtwapwcm-dash-small); font-weight: 700; line-height: 1.35; letter-spacing: 0; text-transform: none; color: var(--rtwapwcm-dash-ink); }
.rtwapwcm_dash_layout_two .rtwapwcm_dash_eligible_title,
.rtwapwcm_wrapper h4.rtwapwcm_dash_eligible_title { font-size: 14px; font-weight: 700; color: var(--rtwapwcm-dash-ink); }
.rtwapwcm_dash_eligible_note { margin: 2px 0 0; font-size: var(--rtwapwcm-dash-micro); line-height: 1.5; color: var(--rtwapwcm-dash-muted); max-width: 60ch; }
.rtwapwcm_dash_eligible_toggle {
	appearance: none;
	-webkit-appearance: none;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex: none;
	margin: 0;
	padding: 7px 12px;
	border: 1px solid var(--rtwapwcm-dash-accent-line);
	border-radius: 8px;
	background: #fff;
	color: var(--rtwapwcm-dash-accent-ink);
	font: inherit;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	transition: background-color .12s ease, border-color .12s ease;
}
.rtwapwcm_dash_eligible_toggle:hover { background: var(--rtwapwcm-dash-accent-soft); border-color: var(--rtwapwcm-dash-accent); }
.rtwapwcm_dash_eligible_toggle:focus-visible { outline: 2px solid var(--rtwapwcm-dash-accent); outline-offset: 2px; }
.rtwapwcm_dash_eligible_chev { flex: none; width: 8px; height: 8px; margin: -3px 2px 0 0; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .18s ease; }
.rtwapwcm_dash_eligible_toggle[aria-expanded="true"] .rtwapwcm_dash_eligible_chev { margin-top: 3px; transform: rotate(-135deg); }
/* the panel opens by growing its one grid row: no fixed height, no jump */
.rtwapwcm_dash_eligible_panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .26s ease; }
.rtwapwcm_dash_eligible_panel.rtwapwcm_is_open { grid-template-rows: 1fr; }
.rtwapwcm_dash_eligible_inner { min-height: 0; overflow: hidden; }
.rtwapwcm_dash_eligible_intro { margin: 0; padding: 10px 16px 12px; border-top: 1px solid var(--rtwapwcm-dash-line); font-size: var(--rtwapwcm-dash-small); color: var(--rtwapwcm-dash-muted); background: #fff; }
.rtwapwcm_dash_eligible_panel .rtwapwcm_dash_table_wrap { border-top: 1px solid var(--rtwapwcm-dash-line); background: #fff; border-radius: 0 0 10px 10px; }
.rtwapwcm_dash_eligible_table { margin-top: 0; }
.rtwapwcm_dash_eligible_table thead th { border-top: 0; background: var(--rtwapwcm-dash-raise); font-size: 11px; letter-spacing: .1em; padding: 9px 14px; }
.rtwapwcm_dash_eligible_table td { padding: 13px 14px; vertical-align: top; }
.rtwapwcm_dash_eligible_table tbody tr:nth-child(even) { background: transparent; }
.rtwapwcm_dash_eligible_table tbody tr:hover { background: var(--rtwapwcm-dash-raise); }
.rtwapwcm_dash_col_n { width: 44px; }
.rtwapwcm_dash_eligible_table th:nth-child(5),
.rtwapwcm_dash_eligible_table td:nth-child(5) { min-width: 240px; }
.rtwapwcm_dash_eligible_table th:nth-child(4),
.rtwapwcm_dash_eligible_table td:nth-child(4) { min-width: 150px; }
.rtwapwcm_dash_elig_n {
	display: inline-flex;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	align-items: center;
	justify-content: center;
	border: 2px solid var(--rtwapwcm-dash-line);
	color: var(--rtwapwcm-dash-muted);
	font-size: 12px;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}
.rtwapwcm_dash_elig_active .rtwapwcm_dash_elig_n { border-color: var(--rtwapwcm-dash-accent); color: var(--rtwapwcm-dash-accent); }
.rtwapwcm_dash_elig_amount { display: block; font-weight: 700; color: var(--rtwapwcm-dash-ink); line-height: 1.4; }
.rtwapwcm_dash_layout_two .rtwapwcm_dash_elig_amount { color: var(--rtwapwcm-dash-accent-ink); }
.rtwapwcm_dash_eligible_table td .rtwapwcm_dash_chip { margin: 6px 0 0; }
.rtwapwcm_dash_elig_status { font-size: var(--rtwapwcm-dash-micro); padding: 3px 10px; white-space: normal; line-height: 1.4; }
.rtwapwcm_dash_elig_status_active { background: #e6f4ea; color: #1e6b32; }
.rtwapwcm_dash_elig_status_soon { background: var(--rtwapwcm-dash-warn-soft); color: var(--rtwapwcm-dash-warn); }
.rtwapwcm_dash_elig_status_partial { background: #eef2ff; color: #3b4fb8; }
/* "some products use an earlier rate" is a state, not a brand mark: a fixed slate, so a warm or green
   brand colour can never make it read as "starts later" or "active" */
.rtwapwcm_dash_layout_one .rtwapwcm_dash_elig_status_partial { background: #eceff4; color: #3d4a5c; }
/* a theme's own focus outline on a mouse click is not part of this template: the keyboard ring stays */
.rtwapwcm_dash_layout_one .rtwapwcm_dash_eligible_toggle:focus:not(:focus-visible),
.rtwapwcm_dash_layout_one .rtwapwcm_dash_elig_details:focus:not(:focus-visible),
.rtwapwcm_dash_layout_one .rtwapwcm_dash_modal_close:focus:not(:focus-visible) { outline: none; }
.rtwapwcm_dash_elig_status_off { background: #eef0f3; color: #5c6470; }
.rtwapwcm_dash_elig_status_excluded { background: #fbeaea; color: #8a1f11; }
.rtwapwcm_dash_elig_note { display: block; margin-top: 5px; font-size: var(--rtwapwcm-dash-micro); line-height: 1.45; color: var(--rtwapwcm-dash-muted); max-width: 34ch; }
.rtwapwcm_dash_elig_off td { color: var(--rtwapwcm-dash-muted); }
.rtwapwcm_dash_elig_off .rtwapwcm_dash_elig_amount { color: var(--rtwapwcm-dash-muted); text-decoration: line-through; text-decoration-color: #c7ccd6; }
.rtwapwcm_dash_col_act { width: 1%; white-space: nowrap; text-align: right; }
.rtwapwcm_dash_elig_details {
	appearance: none;
	-webkit-appearance: none;
	margin: 0;
	padding: 7px 12px;
	border: 1px solid var(--rtwapwcm-dash-accent-line);
	border-radius: 8px;
	background: #fff;
	color: var(--rtwapwcm-dash-accent-ink);
	font: inherit;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	transition: background-color .12s ease, border-color .12s ease;
}
.rtwapwcm_dash_elig_details:hover { background: var(--rtwapwcm-dash-accent-soft); border-color: var(--rtwapwcm-dash-accent); }
.rtwapwcm_dash_elig_details:focus-visible { outline: 2px solid var(--rtwapwcm-dash-accent); outline-offset: 2px; }
/* on an opportunity row the control is a quiet text link, not a second button per row */
.rtwapwcm_dash_offer_link { padding: 6px 8px; border-color: transparent; background: transparent; }
.rtwapwcm_dash_offer_link:hover { border-color: var(--rtwapwcm-dash-accent-line); background: var(--rtwapwcm-dash-accent-soft); }

/* ------------------------------------------------------------ details dialog */
.rtwapwcm_dash_modal { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: center; justify-content: center; padding: 24px; }
.rtwapwcm_dash_modal[hidden] { display: none; }
.rtwapwcm_dash_modal_backdrop { position: absolute; inset: 0; background: rgba(42, 45, 44, .82); opacity: 0; transition: opacity .18s ease; }
.rtwapwcm_dash_modal_panel {
	position: relative;
	width: min(600px, 100%);
	max-height: min(84vh, 760px);
	display: flex;
	flex-direction: column;
	background: #fff;
	color: var(--rtwapwcm-dash-ink, #1d2327);
	border-radius: 14px;
	box-shadow: 0 24px 64px rgba(16, 24, 40, .32);
	transform: translateY(12px) scale(.98);
	opacity: 0;
	transition: transform .18s ease, opacity .18s ease;
	outline: none;
	font-size: 15px;
	line-height: 1.5;
}
.rtwapwcm_dash_modal.rtwapwcm_is_open .rtwapwcm_dash_modal_backdrop { opacity: 1; }
.rtwapwcm_dash_modal.rtwapwcm_is_open .rtwapwcm_dash_modal_panel { transform: none; opacity: 1; }
.rtwapwcm_dash_modal_head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 20px 22px 14px; border-bottom: 1px solid #e4e7ec; }
.rtwapwcm_dash_modal_heading { min-width: 0; }
.rtwapwcm_dash_modal_head .rtwapwcm_dash_block_kind { color: var(--rtwapwcm-dash-accent, #1966a4); margin-bottom: 4px; }
.rtwapwcm_dash_modal_title { margin: 0; font-size: 21px; font-weight: 700; letter-spacing: -.015em; line-height: 1.25; color: #1d2327; overflow-wrap: anywhere; }
.rtwapwcm_dash_modal_close {
	appearance: none;
	-webkit-appearance: none;
	flex: none;
	width: 36px;
	height: 36px;
	margin: -4px -6px 0 0;
	padding: 0;
	border: 1px solid #e4e7ec;
	border-radius: 50%;
	background: #fff;
	color: #1d2327;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}
.rtwapwcm_dash_modal_close:hover { background: #f3f4f6; }
.rtwapwcm_dash_modal_close:focus-visible { outline: 2px solid var(--rtwapwcm-dash-accent, #1966a4); outline-offset: 2px; }
.rtwapwcm_dash_modal_body { flex: 1 1 auto; overflow-y: auto; padding: 6px 22px 22px; }
.rtwapwcm_dash_mlead { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; padding: 12px 0 6px; }
.rtwapwcm_dash_morder { font-size: 12px; font-weight: 600; letter-spacing: .02em; color: #5c6470; }
/* sections: an icon disc, a label, the content — only the sections that apply are rendered */
.rtwapwcm_dash_msec { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 12px; padding: 12px 0; border-top: 1px solid #f0f2f5; }
.rtwapwcm_dash_mlead + .rtwapwcm_dash_msec { border-top: 0; }
.rtwapwcm_dash_msec_icon { display: inline-flex; width: 32px; height: 32px; border-radius: 9px; align-items: center; justify-content: center; background: var(--rtwapwcm-dash-accent-soft, #e9f1f9); color: var(--rtwapwcm-dash-accent-ink, #14507f); }
.rtwapwcm_dash_msec_icon svg { width: 17px; height: 17px; }
.rtwapwcm_dash_msec_excludes .rtwapwcm_dash_msec_icon { background: #fbeaea; color: #8a1f11; }
.rtwapwcm_dash_msec_how .rtwapwcm_dash_msec_icon { background: #f0f1f3; color: #5c6470; }
.rtwapwcm_dash_msec_body { min-width: 0; padding-top: 4px; }
.rtwapwcm_dash_msec_title { margin: 0 0 6px; font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #5c6470; }
.rtwapwcm_dash_msec_body p { margin: 0; }
.rtwapwcm_dash_mnote { margin: 0 0 6px !important; font-size: 13px; color: #5c6470; }
.rtwapwcm_dash_mchips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.rtwapwcm_dash_mchips li { margin: 0; padding: 4px 10px; border: 1px solid #e4e7ec; border-radius: 999px; background: #f7f8fa; color: #1d2327; font-size: 14px; font-weight: 600; line-height: 18px; list-style: none; overflow-wrap: anywhere; }
.rtwapwcm_dash_mlist { margin: 0; padding: 0; list-style: none; }
.rtwapwcm_dash_mlist li { position: relative; margin: 0 0 6px; padding: 0 0 0 14px; line-height: 1.5; overflow-wrap: anywhere; list-style: none; }
.rtwapwcm_dash_mlist li:last-child { margin-bottom: 0; }
.rtwapwcm_dash_mlist li:before { content: ""; position: absolute; left: 0; top: .66em; width: 6px; height: 6px; border-radius: 50%; background: #c7ccd6; }
.rtwapwcm_dash_mreq { font-weight: 600; }
.rtwapwcm_dash_mprogress_text { margin: 2px 0 0 !important; font-size: 13px; color: #5c6470; }
.rtwapwcm_dash_mprogress { position: relative; height: 6px; margin: 8px 0 2px; border-radius: 999px; background: #e9edf2; overflow: hidden; }
.rtwapwcm_dash_mprogress span { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 999px; background: var(--rtwapwcm-dash-accent, #1966a4); }
.rtwapwcm_dash_mprogress_met span { background: #1e6b32; }
.rtwapwcm_dash_mfoot { margin: 14px 0 0; padding-top: 12px; border-top: 1px solid #f0f2f5; font-size: 12px; color: #5c6470; }
body.rtwapwcm_modal_open { overflow: hidden; }
/* template two: the dialog takes the template's own colours */
.rtwapwcm_dash_block_commission.rtwapwcm_dash_layout_two .rtwapwcm_dash_modal_head .rtwapwcm_dash_block_kind { color: var(--secondary-color, #cb0c9f); }
.rtwapwcm_dash_block_commission.rtwapwcm_dash_layout_two .rtwapwcm_dash_modal_title { color: var(--primary-color, #384c6d); }
.rtwapwcm_dash_block_commission.rtwapwcm_dash_layout_two .rtwapwcm_dash_msec_icon { background: var(--rtwapwcm-dash-accent-soft); color: var(--primary-color, #384c6d); }
.rtwapwcm_dash_block_commission.rtwapwcm_dash_layout_two .rtwapwcm_dash_msec_excludes .rtwapwcm_dash_msec_icon { background: #fbeaea; color: #8a1f11; }
.rtwapwcm_dash_block_commission.rtwapwcm_dash_layout_two .rtwapwcm_dash_mprogress span { background: var(--primary-color, #384c6d); }
.rtwapwcm_dash_block_commission.rtwapwcm_dash_layout_two .rtwapwcm_dash_modal_close:focus-visible { outline-color: var(--primary-color, #384c6d); }
/* template two sizes every h4/h5 inside .rtwapwcm_wrapper (a class + element selector), which outranks a
   plain class: the dialog's headings restate their size and weight at a higher specificity */
.rtwapwcm_dash_modal h4.rtwapwcm_dash_modal_title { font-size: 21px; font-weight: 700; line-height: 1.25; letter-spacing: -.015em; margin: 0; }
.rtwapwcm_dash_modal h5.rtwapwcm_dash_msec_title { font-size: 11px; font-weight: 700; line-height: 1.4; letter-spacing: .12em; text-transform: uppercase; color: #5c6470; margin: 0 0 6px; }
.rtwapwcm_dash_block_commission.rtwapwcm_dash_layout_two .rtwapwcm_dash_modal h4.rtwapwcm_dash_modal_title { color: var(--primary-color, #384c6d); }

@media screen and (max-width: 782px) {
	.rtwapwcm_dash_offers { grid-template-columns: 1fr; }
	.rtwapwcm_dash_offer { grid-template-columns: auto minmax(0, 1fr); padding: 12px; gap: 12px; }
	.rtwapwcm_dash_offer_link { grid-column: 2; justify-self: start; margin: -2px 0 0 -8px; }
	.rtwapwcm_dash_eligible { margin-left: var(--rtwapwcm-dash-pad); margin-right: var(--rtwapwcm-dash-pad); }
	.rtwapwcm_dash_eligible_head { flex-direction: column; align-items: flex-start; gap: 10px; padding: 12px 14px; }
	/* rows become cards */
	.rtwapwcm_dash_eligible_table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
	.rtwapwcm_dash_eligible_table,
	.rtwapwcm_dash_eligible_table tbody,
	.rtwapwcm_dash_eligible_table tr,
	.rtwapwcm_dash_eligible_table td { display: block; width: 100%; }
	.rtwapwcm_dash_eligible_table tbody tr { position: relative; margin: 12px; width: auto; padding: 12px 12px 12px 48px; border: 1px solid var(--rtwapwcm-dash-line); border-radius: 10px; background: #fff; }
	.rtwapwcm_dash_eligible_table tbody tr:hover { background: #fff; }
	.rtwapwcm_dash_eligible_table td { padding: 4px 0; border-top: 0; }
	.rtwapwcm_dash_eligible_table td:before { content: attr(data-rtwapwcm-label); display: block; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--rtwapwcm-dash-muted); margin-bottom: 2px; }
	.rtwapwcm_dash_eligible_table td.rtwapwcm_dash_col_n { position: absolute; left: 12px; top: 12px; width: auto; padding: 0; }
	.rtwapwcm_dash_eligible_table td.rtwapwcm_dash_col_n:before { display: none; }
	.rtwapwcm_dash_eligible_table td.rtwapwcm_dash_col_act { text-align: left; white-space: normal; padding-top: 8px; }
	.rtwapwcm_dash_eligible_table td.rtwapwcm_dash_col_act:before { display: none; }
	.rtwapwcm_dash_elig_note { max-width: none; }
	/* the dialog becomes a bottom sheet */
	.rtwapwcm_dash_modal { align-items: flex-end; padding: 0; }
	.rtwapwcm_dash_modal_panel { width: 100%; max-height: 90vh; border-radius: 16px 16px 0 0; transform: translateY(24px); }
	.rtwapwcm_dash_modal_head { padding: 16px 16px 12px; }
	.rtwapwcm_dash_modal_body { padding: 4px 16px 24px; }
}
@media (prefers-reduced-motion: reduce) {
	.rtwapwcm_dash_eligible_panel, .rtwapwcm_dash_modal_backdrop, .rtwapwcm_dash_modal_panel, .rtwapwcm_dash_eligible_chev, .rtwapwcm_dash_offer { transition: none; }
}

/* ------------------------------------------------------------------
 * Payout: the bank-details form (both templates).
 * One label-above-field layout; the accent follows the template's own primary colour.
 * ------------------------------------------------------------------ */
.rtwapwcm_bank_form { --rtwapwcm-bank-accent: var(--rtwapwcm-template1-primary, var(--primary-color, #1966a4)); width: 100%; max-width: 760px; box-sizing: border-box; }
.rtwapwcm_bank_form .rtwapwcm_bank_intro { margin: 0 0 18px; max-width: 68ch; font-size: 14px; line-height: 1.55; color: #5b6472; }
.rtwapwcm_bank_form .rtwapwcm_bank_row { display: flex; flex-wrap: wrap; align-items: flex-start; row-gap: 16px; margin-left: -8px; margin-right: -8px; }
.rtwapwcm_bank_form .rtwapwcm_bank_field { width: 50%; margin: 0 !important; padding: 0 8px; box-sizing: border-box; }
.rtwapwcm_bank_form .rtwapwcm_bank_field.rtwapwcm_d-none { display: none !important; }
.rtwapwcm_bank_form .rtwapwcm_bank_label { display: block; margin: 0 0 6px; font-size: 13px; font-weight: 600; line-height: 1.35; color: #2b3440; }
.rtwapwcm_bank_form .rtwapwcm_bank_req { color: #c0392b; }
.rtwapwcm_bank_form .rtwapwcm_bank_opt { font-weight: 400; text-transform: none; color: #7a8594; }
.rtwapwcm_bank_form input[type="text"],
.rtwapwcm_bank_form select.rtwapwcm_bank_select { display: block; width: 100%; max-width: 100%; min-height: 44px; margin: 0; padding: 9px 12px; box-sizing: border-box; font-size: 15px; line-height: 1.4; color: #1f2733; background-color: #fff; border: 1px solid #c3cad5; border-radius: 6px; box-shadow: none; transition: border-color .15s ease, box-shadow .15s ease; }
.rtwapwcm_bank_form select.rtwapwcm_bank_select { -webkit-appearance: none; appearance: none; padding-right: 36px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%235b6472' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; text-overflow: ellipsis; }
.rtwapwcm_bank_form input[type="text"]:focus,
.rtwapwcm_bank_form select.rtwapwcm_bank_select:focus { outline: 0; border-color: var(--rtwapwcm-bank-accent); box-shadow: 0 0 0 3px rgba(25, 102, 164, .2); }
@supports (color: color-mix(in srgb, red 10%, white)) {
	.rtwapwcm_bank_form input[type="text"]:focus,
	.rtwapwcm_bank_form select.rtwapwcm_bank_select:focus { box-shadow: 0 0 0 3px color-mix(in srgb, var(--rtwapwcm-bank-accent) 22%, transparent); }
}
/* codes are stored in capitals without spaces: show them the way they will be kept */
.rtwapwcm_bank_form #rtwapwcm_iban, .rtwapwcm_bank_form #rtwapwcm_swift, .rtwapwcm_bank_form #rtwapwcm_ifsc { text-transform: uppercase; }
/* Template 1 gives each method's block half the panel; ten bank fields need the room */
.rtwapwcm_payment_tab_details.rtwapwcm_direct_bank_details_tab { width: 100%; }
.rtwapwcm_bank_form .rtwapwcm_bank_help { display: block; margin-top: 5px; font-size: 12px; line-height: 1.4; color: #6b7583; }
.rtwapwcm_bank_form .rtwapwcm_bank_error { margin: 16px 0 0; padding: 10px 12px; border-left: 3px solid #c0392b; border-radius: 4px; background: #fdf0ee; color: #8a2a1f; font-size: 14px; line-height: 1.45; }
.rtwapwcm_bank_form .rtwapwcm_bank_error[hidden] { display: none; }
.rtwapwcm_bank_form + .rtwapwcm_btn,
.rtwapwcm_bank_form + .rtwapwcm_row { margin-top: 18px; }
@media screen and (max-width: 600px) {
	.rtwapwcm_bank_form .rtwapwcm_bank_field { width: 100%; }
}

/* ------------------------------------------------------------------
 * Wallet -> coupon (both templates) and the customer's store credits:
 * the available balance above the field, and what is wrong with the
 * amount said next to it, in the same voice as the payout form's
 * message. Never an alert(), and never "less than 0" on an empty
 * wallet - that screen now offers no amount box at all.
 * ------------------------------------------------------------------ */
.rtwapwcm_coupon_form .rtwapwcm_coupon_avail { margin: 0 0 10px; font-size: 13px; line-height: 1.45; color: #5b6472; }
.rtwapwcm_coupon_error,
.rtwapwcm_form_error { margin: 12px 0 0; padding: 10px 12px; border-left: 3px solid #c0392b; border-radius: 4px; background: #fdf0ee; color: #8a2a1f; font-size: 14px; line-height: 1.45; text-align: left; }
.rtwapwcm_coupon_error[hidden],
.rtwapwcm_form_error[hidden] { display: none; }

/* ------------------------------------------------------------------
 * Create Banner (both templates): search row, result cards, the list's
 * loading / empty / error states, the product link row and the banner
 * preview. Each template keeps its own button colours.
 * ------------------------------------------------------------------ */
.rtwapwcm_prdct_container { display: flex; flex-wrap: wrap; align-items: stretch; row-gap: 20px; }
.rtwapwcm_prdct_container .rtwapwcm_banner_card_col { display: flex; box-sizing: border-box; }
.rtwapwcm_prdct_container .rtwapwcm_banner_card { display: flex; flex-direction: column; width: 100%; margin: 0; background: #fff; border: 1px solid #e4e7ec; border-radius: 10px; box-shadow: 0 1px 2px rgba(16, 24, 40, .05); overflow: hidden; }
.rtwapwcm_prdct_container .rtwapwcm_banner_card .rtwapwcm_prdct_image { height: auto; aspect-ratio: 4 / 3; background: #f4f5f7; overflow: hidden; }
.rtwapwcm_prdct_container .rtwapwcm_banner_card .rtwapwcm_prdct_image img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; }
.rtwapwcm_prdct_container .rtwapwcm_banner_card .rtwapwcm_prdct_image_placeholder img { object-fit: contain; padding: 14%; box-sizing: border-box; opacity: .75; }
.rtwapwcm_prdct_container .rtwapwcm_banner_card .rtwapwcm_prdct_content { display: flex; flex-direction: column; flex: 1 1 auto; gap: 6px; padding: 14px 16px 16px; text-align: left; border-radius: 0; }
.rtwapwcm_prdct_container .rtwapwcm_banner_card .rtwapwcm_prdct_title { margin: 0; font-size: 15px; font-weight: 600; line-height: 1.35; text-transform: none; color: #1d2327; overflow-wrap: anywhere; }
.rtwapwcm_prdct_container .rtwapwcm_banner_card .rtwapwcm_prdct_price { margin: 0; font-size: 15px; font-weight: 700; line-height: 1.35; color: #1d2327; }
.rtwapwcm_prdct_container .rtwapwcm_banner_card .rtwapwcm_prdct_price del { margin-right: 6px; font-weight: 400; color: #6b7583; }
.rtwapwcm_prdct_container .rtwapwcm_banner_card .rtwapwcm_prdct_price ins { margin: 0; font-size: inherit; font-weight: inherit; color: inherit; text-decoration: none; background: none; }
.rtwapwcm_prdct_container .rtwapwcm_banner_card .rtwapwcm_prdct_descrptn { margin: 0; font-size: 13px; line-height: 1.45; color: #5b6472; }
/* The two actions sit at the bottom of every card, however much text is above them.
   Each one is never narrower than its own label: min-width: max-content is what the flex algorithm
   both floors the button at and breaks the line on, so a narrow card (four to a row, or a longer
   translation such as "Banner erstellen") puts the two buttons on two rows instead of cutting a word
   in half against the card's overflow: hidden. While they do fit side by side they share the row
   equally, as they always have. */
.rtwapwcm_prdct_container .rtwapwcm_banner_card .rtwapwcm_prdct_foooter { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; padding-top: 10px; }
.rtwapwcm_prdct_container .rtwapwcm_banner_card .rtwapwcm_prdct_foooter .rtwapwcm_btn { flex: 1 1 0; min-width: -webkit-max-content; min-width: max-content; min-height: 40px; margin: 0; padding-left: 10px; padding-right: 10px; white-space: nowrap; text-overflow: clip; text-transform: none; }
.rtwapwcm_prdct_container .rtwapwcm_banner_more { flex: 1 1 100%; margin: 0; font-size: 13px; color: #5b6472; }
/* a message where the list would be */
.rtwapwcm_prdct_container .rtwapwcm_banner_state { flex: 1 1 100%; box-sizing: border-box; padding: 28px 20px; text-align: center; border: 1px dashed #d5dae2; border-radius: 10px; background: #fafbfc; }
.rtwapwcm_prdct_container .rtwapwcm_banner_state p { margin: 0; }
.rtwapwcm_prdct_container .rtwapwcm_banner_state_title { font-size: 15px; font-weight: 600; color: #1d2327; }
.rtwapwcm_prdct_container .rtwapwcm_banner_state_note { margin-top: 4px !important; font-size: 13px; line-height: 1.45; color: #5b6472; }
.rtwapwcm_prdct_container .rtwapwcm_banner_state_error { border-style: solid; border-color: #ecc1bc; background: #fdf3f2; }
.rtwapwcm_prdct_container .rtwapwcm_banner_state_error .rtwapwcm_banner_state_title { color: #8a2a1f; }
.rtwapwcm_prdct_container .rtwapwcm_banner_state_loading .rtwapwcm_banner_state_title:before { content: ""; display: inline-block; width: 14px; height: 14px; margin: -2px 8px 0 0; vertical-align: middle; border: 2px solid #c3cad5; border-top-color: #5b6472; border-radius: 50%; animation: rtwapwcm_banner_spin .8s linear infinite; }
@keyframes rtwapwcm_banner_spin { to { transform: rotate(360deg); } }
/* search row: one height, one baseline */
.rtwapwcm_create_banner_form #rtwapwcm_search_prdct_inpt { min-height: 44px; box-sizing: border-box; }
.rtwapwcm_create_banner_form #rtwapwcm_search_Prdcts { min-height: 44px; margin-top: 0; margin-bottom: 0; }
.rtwapwcm_create_banner_form #rtwapwcm_search_Prdcts[disabled] { opacity: .6; cursor: progress; }
.rtwapwcm_create_banner_form .select2-container .select2-selection--single { height: 44px; display: flex; align-items: center; }
.rtwapwcm_create_banner_form .select2-container .select2-selection--single .select2-selection__arrow { height: 42px; }
/* the product link: the whole address can be read, and the copy button is a real target */
.rtwapwcm_copy_link_wrapper { box-sizing: border-box; max-width: 100%; align-items: stretch; border: 1px solid #c3cad5; border-radius: 8px; overflow: hidden; background: #fff; }
.rtwapwcm_copy_link_wrapper p.rtwapwcm_copy_link_inpt { flex: 1 1 auto; width: auto; min-width: 0; padding: 10px 12px; font-size: 13px; line-height: 1.5; white-space: normal; overflow-wrap: anywhere; text-overflow: clip; }
.rtwapwcm_copy_link_wrapper #rtwapwcm_copy_banner_link_btn { flex: none; width: 48px; min-height: 44px; margin: 0; border: 0; border-left: 1px solid #c3cad5; border-radius: 0; background: #f4f5f7; color: #1d2327; cursor: pointer; }
/* ------------------------------------------------------------------
 * The banner maker (Create banner dialog, both templates).
 * The banner is shown at the size it will have on a page — a 520px card with a square picture —
 * on a dotted "artboard"; it never grows with the product's photo. Style controls sit under it
 * in one tidy grid, the two copy actions in the footer. Accents come from the template's own
 * colour system: Template 1's primary/secondary tokens, Template 2's --primary/--secondary.
 * ------------------------------------------------------------------ */
#rtwapwcm_banner_modal {
	--rtwapwcm-bn-accent: var(--rtwapwcm-template1-primary, var(--primary-color, #384c6d));
	--rtwapwcm-bn-accent-2: var(--rtwapwcm-template1-secondary, var(--secondary-color, #cb0c9f));
	--rtwapwcm-bn-line: #e4e7ec;
	--rtwapwcm-bn-ink: #1d2327;
	--rtwapwcm-bn-muted: #5b6472;
	align-items: center; justify-content: center; padding: 24px; box-sizing: border-box; overflow-y: auto;
}
#rtwapwcm_banner_modal .rtwapwcm_modal_dialog { width: 100%; max-width: 720px; max-height: calc(100vh - 48px); margin: auto; display: flex; flex-direction: column; border-radius: 14px; overflow: hidden; background: #fff; box-shadow: 0 24px 60px rgba(16, 24, 40, .28); animation: none; }
#rtwapwcm_banner_modal .rtwapwcm-modal-header { flex: none; align-items: center; padding: 14px 18px; border-bottom: 1px solid var(--rtwapwcm-bn-line); }
#rtwapwcm_banner_modal .rtwapwcm-modal-header-title,
#rtwapwcm_banner_modal .rtwapwcm_modal_title { margin: 0; font-size: 17px; font-weight: 600; line-height: 1.3; color: var(--rtwapwcm-bn-ink); }
#rtwapwcm_banner_modal .rtwapwcm_modal_body { flex: 1 1 auto; height: auto; max-height: none; min-height: 0; overflow-y: auto; padding: 0; }
/* the artboard */
#rtwapwcm_banner_modal .rtwapwcm_modal_body > div:first-child:not(.rtwapwcm_banner_prdct_body) { padding: 0; }
#rtwapwcm_banner_modal .rtwapwcm_banner_prdct_body { position: relative; box-sizing: border-box; width: min(520px, calc(100% - 40px)); margin: 46px auto 26px; border: 1px solid var(--rtwapwcm-bn-line); border-radius: 10px; overflow: hidden; background: #fff; box-shadow: 0 6px 18px rgba(16, 24, 40, .10); }
#rtwapwcm_banner_modal .rtwapwcm_modal_body:before { content: ""; position: absolute; z-index: 0; left: 0; right: 0; height: 0; }
#rtwapwcm_banner_modal .rtwapwcm_banner_prdct_body:before { content: "Preview"; content: var(--rtwapwcm-bn-preview-label, "Preview"); position: absolute; left: 0; top: -30px; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--rtwapwcm-bn-muted); }
#rtwapwcm_banner_modal .rtwapwcm_banner_prdct_body { overflow: visible; }
#rtwapwcm_banner_modal .rtwapwcm_banner_prdct_body > .rtwapwcm_row { display: grid; grid-template-columns: 180px minmax(0, 1fr); align-items: stretch; margin: 0; border-radius: 9px; overflow: hidden; }
#rtwapwcm_banner_modal .rtwapwcm_banner_prdct_image { width: auto; height: auto; min-width: 0; padding: 0; aspect-ratio: 1 / 1; background: #f4f5f7; overflow: hidden; }
#rtwapwcm_banner_modal .rtwapwcm_banner_prdct_image .rtwapwcm_responsive_img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center; }
/* the store's placeholder is a drawing, not a photo: shown whole, smaller, on the neutral ground */
#rtwapwcm_banner_modal .rtwapwcm_banner_prdct_image .rtwapwcm_responsive_img[src*="placeholder"] { object-fit: contain; padding: 22%; box-sizing: border-box; opacity: .7; }
#rtwapwcm_banner_modal .rtwapwcm_banner_prdct_content { width: auto; min-width: 0; box-sizing: border-box; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 6px; padding: 18px 20px; text-align: left; overflow-wrap: anywhere; }
#rtwapwcm_banner_modal .rtwapwcm_banner_prdct_content .rtwapwcm_prdct_title { margin: 0; font-size: 17px; font-weight: 700; line-height: 1.3; text-transform: none; color: var(--rtwapwcm-bn-ink); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
#rtwapwcm_banner_modal .rtwapwcm_banner_prdct_price { margin: 0; font-family: inherit; font-size: 22px; font-weight: 700; line-height: 1.2; color: var(--rtwapwcm-bn-ink); }
#rtwapwcm_banner_modal .rtwapwcm_banner_prdct_foooter { margin-top: 8px; padding-top: 0; border-top: 0; }
#rtwapwcm_banner_modal .rtwapwcm_banner_buy_now { text-decoration: none; }
#rtwapwcm_banner_modal #rtwapwcm_buy_now_btn { min-height: 38px; margin: 0; padding: 0 20px; font-size: 14px; font-weight: 600; line-height: 38px; color: #fff; background: var(--rtwapwcm-bn-accent); border: 0; border-radius: 999px; cursor: pointer; }
/* the ground the preview stands on */
#rtwapwcm_banner_modal .rtwapwcm_modal_body { background-color: #f6f7f9; background-image: radial-gradient(circle, rgba(16, 24, 40, .13) 1px, transparent 1.2px); background-size: 16px 16px; }
/* style controls */
#rtwapwcm_banner_modal .rtwapwcm_banner_style_content { margin: 0; padding: 16px 20px 18px; background: #fff; border-top: 1px solid var(--rtwapwcm-bn-line); }
#rtwapwcm_banner_modal .rtwapwcm_banner_style_content > h3,
#rtwapwcm_banner_modal .rtwapwcm_banner_style_content > .rtwapwcm_label { margin: 0 0 12px; font-size: 13px; font-weight: 700; letter-spacing: .02em; text-transform: none; color: var(--rtwapwcm-bn-ink); }
#rtwapwcm_banner_modal .rtwapwcm_banner_style_content > .rtwapwcm_row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 14px; margin: 0; align-items: end; }
#rtwapwcm_banner_modal .rtwapwcm_banner_style_list { width: auto; margin: 0; padding: 0; }
#rtwapwcm_banner_modal .rtwapwcm_banner_style_label { display: block; margin: 0 0 5px; font-size: 12px; font-weight: 600; line-height: 1.35; text-transform: none; color: var(--rtwapwcm-bn-muted); }
#rtwapwcm_banner_modal .rtwapwcm_color_container { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 40px; box-sizing: border-box; padding: 4px 10px 4px 5px; font-size: 13px; color: var(--rtwapwcm-bn-ink); background: #fff; border: 1px solid #c3cad5; border-radius: 8px; }
#rtwapwcm_banner_modal .rtwapwcm_color_container:focus-within { border-color: var(--rtwapwcm-bn-accent); box-shadow: 0 0 0 3px rgba(16, 24, 40, .08); }
#rtwapwcm_banner_modal .rtwapwcm_color_container input[type="color"] { flex: none; width: 30px; height: 30px; margin: 0; padding: 0; border: 0; border-radius: 6px; background: none; cursor: pointer; }
#rtwapwcm_banner_modal .rtwapwcm_color_container span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-variant-numeric: tabular-nums; }
#rtwapwcm_banner_modal .rtwapwcm_banner_style_checkbox_cont,
#rtwapwcm_banner_modal .rtwapwcm_style_settings { width: auto; margin: 0; padding: 0; display: flex; align-items: center; min-height: 40px; font-size: 14px; color: var(--rtwapwcm-bn-ink); }
#rtwapwcm_banner_modal .rtwapwcm_banner_style_checkbox_cont .rtwapwcm_checkbox_container { margin: 0; align-items: center; gap: 8px; cursor: pointer; }
/* actions */
#rtwapwcm_banner_modal .rtwapwcm_banner-modal-footer,
#rtwapwcm_banner_modal .rtwapwcm-modal-footer { flex: none; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; margin: 0; padding: 14px 20px; background: #fff; border-top: 1px solid var(--rtwapwcm-bn-line); }
#rtwapwcm_banner_modal .rtwapwcm_banner-modal-footer .rtwapwcm_btn,
#rtwapwcm_banner_modal .rtwapwcm-modal-footer button { margin: 0; min-height: 42px; }
/* the first action ("copy script") is the alternative, "copy HTML" the main one */
#rtwapwcm_banner_modal .rtwapwcm_banner-modal-footer .rtwapwcm_copy_banner_script { background: #fff; color: var(--rtwapwcm-bn-accent); border: 1px solid var(--rtwapwcm-bn-accent); box-shadow: none; }
/* Template 2 draws its buttons with Material's own colour: its alternative action is outlined in that colour, not in Template 1's */
#rtwapwcm_banner_modal .rtwapwcm-modal-footer .rtwapwcm_copy_banner_script { background-color: #fff !important; color: #018786; border: 1px solid #018786; box-shadow: none; } /* #018786 is Template 2's own button colour (.mdc-button, set with !important in its stylesheet) */
#rtwapwcm_banner_modal .rtwapwcm-modal-footer .rtwapwcm_copy_banner_script .mdc-button__label { color: #018786; }
/* the close control is a square, whatever the template's button rules make of it */
#rtwapwcm_banner_modal #rtwapwcm_banner_modal_close { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 40px; min-width: 40px; height: 40px; min-height: 40px; margin: 0; padding: 0; border-radius: 8px; cursor: pointer; }
@media screen and (max-width: 600px) {
	.rtwapwcm_prdct_container .rtwapwcm_banner_card_col { width: 100%; }
	.rtwapwcm_create_banner_form #rtwapwcm_search_Prdcts { min-height: 44px; }
	.rtwapwcm_prdct_container .rtwapwcm_banner_card .rtwapwcm_prdct_foooter .rtwapwcm_btn { min-height: 44px; }
	/* the banner maker on a phone: the banner keeps its row, with a smaller picture */
	/* centred with a small margin rather than glued to the bottom edge: a theme's own bottom bar (Storefront's
	   handheld bar, for one) would cover the copy buttons of a bottom sheet */
	#rtwapwcm_banner_modal { align-items: center; padding: 12px; }
	#rtwapwcm_banner_modal .rtwapwcm_modal_dialog { max-width: none; max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); border-radius: 14px; }
	#rtwapwcm_banner_modal .rtwapwcm_banner_prdct_body { width: calc(100% - 28px); margin: 40px auto 20px; }
	#rtwapwcm_banner_modal .rtwapwcm_banner_prdct_body > .rtwapwcm_row { grid-template-columns: 112px minmax(0, 1fr); }
	#rtwapwcm_banner_modal .rtwapwcm_banner_prdct_content { padding: 12px 14px; gap: 4px; }
	#rtwapwcm_banner_modal .rtwapwcm_banner_prdct_content .rtwapwcm_prdct_title { font-size: 15px; }
	#rtwapwcm_banner_modal .rtwapwcm_banner_prdct_price { font-size: 18px; }
	#rtwapwcm_banner_modal #rtwapwcm_buy_now_btn { min-height: 34px; line-height: 34px; padding: 0 16px; font-size: 13px; }
	#rtwapwcm_banner_modal .rtwapwcm_banner_style_content { padding: 14px; }
	#rtwapwcm_banner_modal .rtwapwcm_banner_style_content > .rtwapwcm_row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	#rtwapwcm_banner_modal .rtwapwcm_color_container { min-height: 44px; }
	#rtwapwcm_banner_modal .rtwapwcm_banner-modal-footer,
	#rtwapwcm_banner_modal .rtwapwcm-modal-footer { padding: 12px 14px calc(12px + env(safe-area-inset-bottom, 0px)); }
	#rtwapwcm_banner_modal .rtwapwcm_banner-modal-footer .rtwapwcm_btn,
	#rtwapwcm_banner_modal .rtwapwcm-modal-footer button { flex: 1 1 0; min-height: 44px; }
	.rtwapwcm_copy_link_wrapper { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
	.rtwapwcm_prdct_container .rtwapwcm_banner_state_loading .rtwapwcm_banner_state_title:before { animation: none; }
}

/* ------------------------------------------------------------------
 * MLM genealogy (both templates): a node shows the person's whole name
 * (two people used to read "QA MLM …" alike), its figures are readable,
 * and a network wider than the screen says that it scrolls.
 * ------------------------------------------------------------------ */
div#rtwapwcm_mlm_show .orgchart .node { width: auto; min-width: 150px; max-width: 230px; }
div#rtwapwcm_mlm_show .orgchart .node .title { display: flex; align-items: stretch; justify-content: center; height: auto; min-height: 38px; padding: 0; line-height: 1.3; white-space: normal; overflow: hidden; text-overflow: clip; overflow-wrap: anywhere; font-size: 14px; }
div#rtwapwcm_mlm_show .orgchart .node .title .symbol { float: none; flex: none; display: flex; align-items: center; height: auto; line-height: 1; margin: 0; }
div#rtwapwcm_mlm_show .orgchart .node .title:not(:has(.symbol)),
div#rtwapwcm_mlm_show .orgchart .node .title { padding: 8px 10px; box-sizing: border-box; align-items: center; gap: 8px; }
div#rtwapwcm_mlm_show .orgchart .node .title .symbol { align-self: stretch; margin: -8px 0 -8px -10px; padding: 0 10px; }
#rtwapwcm_mlm_show .rtwapwcm-node-info { padding: 6px 10px; font-size: 12px; line-height: 1.55; text-align: left; color: #5b6472; background: #fff; border: 1px solid #e4e7ec; border-top: 0; border-radius: 0 0 6px 6px; }
#rtwapwcm_mlm_show .rtwapwcm-node-info > div { display: flex; justify-content: space-between; gap: 10px; white-space: nowrap; }
#rtwapwcm_mlm_show .rtwapwcm-node-info b { font-weight: 700; color: #1d2327; }
#rtwapwcm_mlm_show.rtwapwcm_mlm_scrolls { background: linear-gradient(to right, rgba(16, 24, 40, 0) 0, rgba(16, 24, 40, 0) calc(100% - 28px), rgba(16, 24, 40, .07) 100%); }

/* ------------------------------------------------------------------
 * Phones (both templates), 320–430px: what the full-dashboard review found.
 * ------------------------------------------------------------------ */
/* "Starting later": a chip whose text runs to a second line is a small rounded box, never a pill —
   a pill radius on three lines of text drew a blob that stuck out of its card */
.rtwapwcm_dash_chip_soon { max-width: 100%; box-sizing: border-box; }
@media screen and (max-width: 782px) {
	.rtwapwcm_dash_chip_soon { display: inline-flex; align-items: flex-start; border-radius: 10px; white-space: normal; text-align: left; line-height: 1.35; padding: 5px 10px 5px 8px; }
	.rtwapwcm_dash_chip_soon svg { flex: none; margin-top: 2px; }
	.rtwapwcm_dash_offer { min-width: 0; }
	.rtwapwcm_dash_offer > * { min-width: 0; }
	/* "Your eligible commission rules" as cards: the desktop column widths and cell grounds do not
	   belong in a card — they pushed the text past the card's edge */
	.rtwapwcm_dash_eligible_table td,
	.rtwapwcm_dash_eligible_table td:nth-child(5) { min-width: 0; max-width: 100%; box-sizing: border-box; background: transparent; overflow-wrap: anywhere; }
	/* a theme's zebra striping would paint grey bars across every second card */
	table.rtwapwcm_dash_eligible_table tbody tr:nth-child(even) td,
	table.rtwapwcm_dash_eligible_table tbody tr:nth-child(odd) td { background: transparent !important; }
	.rtwapwcm_dash_eligible_table td .rtwapwcm_dash_chip,
	.rtwapwcm_dash_eligible_table td [class*="rtwapwcm_dash_elig_status"] { max-width: 100%; white-space: normal; border-radius: 10px; }
	/* controls a thumb has to hit */
	.rtwapwcm_dash_eligible_toggle,
	.rtwapwcm_dash_elig_details,
	.rtwapwcm_dash_offer_link,
	button.rtwapwcm_rd_copy { min-height: 44px; }
	.rtwapwcm_dash_modal_close { min-width: 44px; min-height: 44px; }
}
@media screen and (max-width: 480px) {
	/* the list gets the whole width of its block, and the position number sits in the card's corner
	   instead of taking a 48px column from a 190px card */
	.rtwapwcm_dash_eligible { margin-left: 0; margin-right: 0; border-radius: 10px; }
	.rtwapwcm_dash_eligible_table tbody tr { margin: 10px 8px; padding: 12px; }
	.rtwapwcm_dash_eligible_table td.rtwapwcm_dash_col_n { left: auto; right: 12px; top: 12px; }
	.rtwapwcm_dash_eligible_table td:nth-child(2) { padding-right: 40px; }
	.rtwapwcm_dash_eligible_head { padding: 12px; }
}

/* ------------------------------------------------------------------
 * Extra → Download (both templates): a card with one row — the category select and the button on one
 * baseline, the same height. The button is a link: a theme's link underline and link colour do not
 * belong on it. Colours are each template's own button colours.
 * ------------------------------------------------------------------ */
.rtwapwcm_download_card .rtwapwcm_download_intro { margin: 0 0 16px; max-width: 64ch; font-size: 14px; line-height: 1.55; color: #5b6472; }
.rtwapwcm_download_row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; }
.rtwapwcm_download_field { flex: 1 1 260px; min-width: 0; max-width: 420px; }
.rtwapwcm_download_field label { display: block; margin: 0 0 6px; font-size: 13px; font-weight: 600; line-height: 1.35; text-transform: none; color: #2b3440; }
.rtwapwcm_download_field select { width: 100%; min-height: 44px; }
.rtwapwcm_download_field .select2-container { width: 100% !important; }
/* both template stylesheets force every single select to 40px with !important */
.rtwapwcm_download_field .select2-container .select2-selection--single { display: flex; align-items: center; height: 44px !important; box-sizing: border-box; border: 1px solid #c3cad5; border-radius: 6px; }
.rtwapwcm_download_field .select2-container .select2-selection--single .select2-selection__rendered { padding-left: 12px; line-height: 1.4 !important; }
.rtwapwcm_download_field .select2-container .select2-selection--single .select2-selection__arrow { height: 42px !important; }
.rtwapwcm_download_row a#rtwapwcm_generate_csv { flex: none; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; min-height: 44px; height: 44px; margin: 0; padding: 0 22px; line-height: 1; text-decoration: none !important; box-shadow: none; white-space: nowrap; }
.rtwapwcm_download_row a#rtwapwcm_generate_csv,
.rtwapwcm_download_row a#rtwapwcm_generate_csv:hover,
.rtwapwcm_download_row a#rtwapwcm_generate_csv:focus,
.rtwapwcm_download_row a#rtwapwcm_generate_csv .mdc-button__label { color: #fff !important; text-decoration: none !important; }
/* Template 2 printed this screen as a dashed half-width box floating in the middle of the page */
.rtwapwcm_download_wrapper .rtwapwcm_download_card { max-width: 760px; margin: 0; }
.rtwapwcm_download_wrapper .rtwapwcm_download_card .rtwapwcm-inner-padding { height: auto; padding: 22px 24px 24px; }
.rtwapwcm_download_wrapper .rtwapwcm_download_card .rtwapwcm_chart_header { padding: 0; }
.rtwapwcm_download_wrapper .rtwapwcm_download_card .rtwapwcm_chart_header h5 { margin: 0 0 8px; }
@media screen and (max-width: 600px) {
	.rtwapwcm_download_field { flex-basis: 100%; max-width: none; }
	.rtwapwcm_download_row a#rtwapwcm_generate_csv { width: 100%; }
}

/* 3.1.0 - "Share and earn": the link and coupon card on the overview, and the same two controls in the
   top bar's shortcut (both templates). Each value sits in one field with an icon copy button that says
   "Copied" for a moment; the card's rows keep the heading's inner padding, and the card is only as tall as
   its rows. The colours are each layout's own accent tokens. */
.rtwapwcm_share_card { margin: 0 0 24px; }
.rtwapwcm_share_card .rtwapwcm_dash_block_head { padding-top: 18px; padding-bottom: 0; }
.rtwapwcm_share_card .rtwapwcm_dash_block_kind { margin-bottom: 4px; }
.rtwapwcm_share_card .rtwapwcm_dash_block_title { margin: 0; }
.rtwapwcm_share_body { padding: 12px var(--rtwapwcm-dash-pad) 18px; }
.rtwapwcm_share_rows { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 14px 24px; align-items: start; margin: 0; }
.rtwapwcm_share_rows_single { grid-template-columns: minmax(0, 1fr); }
.rtwapwcm_share_row { min-width: 0; }
.rtwapwcm_share_label {
	display: block;
	margin: 0 0 6px;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--rtwapwcm-dash-muted);
}
.rtwapwcm_share_field {
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
	min-height: 44px;
	box-sizing: border-box;
	padding: 3px 3px 3px 12px;
	border: 1px solid var(--rtwapwcm-dash-accent-line, var(--rtwapwcm-dash-line));
	border-radius: 8px;
	background: var(--rtwapwcm-dash-accent-soft);
}
.rtwapwcm_share_value {
	flex: 1 1 auto;
	min-width: 0;
	margin: 0;
	padding: 6px 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--rtwapwcm-dash-ink);
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.45;
	letter-spacing: 0;
	white-space: normal;
	/* a long link wraps inside its field; the button still copies all of it */
	overflow-wrap: anywhere;
	word-break: break-all;
}
.rtwapwcm_share_value.rtwapwcm_share_coupon { font-size: 15px; font-weight: 700; letter-spacing: .06em; }
button.rtwapwcm_share_copy {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-width: 36px;
	height: 36px;
	min-height: 0;
	margin: 0;
	padding: 0 10px;
	border: 1px solid var(--rtwapwcm-dash-accent);
	border-radius: 6px;
	background: #fff;
	color: var(--rtwapwcm-dash-accent);
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	text-transform: none;
	box-shadow: none;
	cursor: pointer;
}
button.rtwapwcm_share_copy i { font-size: 15px; line-height: 1; }
button.rtwapwcm_share_copy .rtwapwcm_rd_copy_label:empty { display: none; }
button.rtwapwcm_share_copy.rtwapwcm_rd_copied .fa-copy:before { content: "\f00c"; }
/* "Copied" in the template's own colours instead of the fixed green: the layout's primary colour (as set for
   the template, or its default) with a pale tint of it as the text. A primary colour too light for that text
   is darkened to OKLCH lightness 0.48, keeping its hue, so every colour stays readable (5:1 or better); a
   browser without relative colours uses the layout's deep shade. */
.rtwapwcm_share_card,
.rtwapwcm_share_pop {
	--rtwapwcm-share-copied: var(--rtwapwcm-dash-accent-ink, var(--rtwapwcm-dash-accent));
	--rtwapwcm-share-copied-text: var(--rtwapwcm-dash-accent-soft, #fff);
}
@supports (color: oklch(from red min(l, 0.48) c h)) {
	.rtwapwcm_share_card,
	.rtwapwcm_share_pop { --rtwapwcm-share-copied: oklch(from var(--rtwapwcm-dash-accent) min(l, 0.48) c h); }
}
.rtwapwcm_share_card button.rtwapwcm_share_copy.rtwapwcm_rd_copied,
.rtwapwcm_share_card button.rtwapwcm_share_copy.rtwapwcm_rd_copied:hover,
.rtwapwcm_share_pop button.rtwapwcm_share_copy.rtwapwcm_rd_copied,
.rtwapwcm_share_pop button.rtwapwcm_share_copy.rtwapwcm_rd_copied:hover {
	background: var(--rtwapwcm-share-copied);
	border-color: var(--rtwapwcm-share-copied);
	color: var(--rtwapwcm-share-copied-text);
}
/* a theme's ring on every focused button (Storefront: purple) would sit around "Copied" after a click or a
   tap; the ring stays for keyboard focus, in the layout's colour (.rtwapwcm_rd_copy:focus-visible) */
.rtwapwcm_share_card button.rtwapwcm_share_copy:focus:not(:focus-visible),
.rtwapwcm_share_pop button.rtwapwcm_share_copy:focus:not(:focus-visible),
button.rtwapwcm_share_shortcut_btn:focus:not(:focus-visible) { outline: none; }
.rtwapwcm_share_note { margin: 4px 0 0; font-size: 13px; font-weight: 600; line-height: 1.4; color: var(--rtwapwcm-dash-ink); }
.rtwapwcm_rd_empty.rtwapwcm_share_empty { margin: 0; padding: 10px 12px; font-size: 13px; line-height: 1.45; }

/* the top bar's shortcut and its panel */
.rtwapwcm_share_shortcut { position: relative; display: inline-flex; align-items: center; }
.rtwapwcm_share_shortcut_two { margin: 0 8px 0 0; }
.rtwapwcm_share_shortcut_two button.rtwapwcm_share_shortcut_btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--primary-color, #384c6d);
	font-size: 18px;
	line-height: 1;
	box-shadow: none;
	cursor: pointer;
}
.rtwapwcm_share_shortcut_two button.rtwapwcm_share_shortcut_btn:hover,
.rtwapwcm_share_shortcut_two button.rtwapwcm_share_shortcut_btn[aria-expanded="true"] { background: rgba(16, 24, 40, .07); }
button.rtwapwcm_share_shortcut_btn:focus-visible { outline: 2px solid var(--rtwapwcm-dash-accent, #384c6d); outline-offset: 2px; }
.rtwapwcm_dash_block.rtwapwcm_share_pop {
	position: absolute;
	top: calc(100% + 10px);
	right: 0;
	z-index: 1000;
	width: min(380px, calc(100vw - 32px));
	box-sizing: border-box;
	margin: 0;
	padding: 14px 16px 16px;
	text-align: left;
	white-space: normal;
	box-shadow: 0 12px 32px rgba(16, 24, 40, .18);
}
.rtwapwcm_dash_block.rtwapwcm_share_pop[hidden] { display: none; }
.rtwapwcm_share_pop .rtwapwcm_share_rows { grid-template-columns: minmax(0, 1fr); gap: 12px; }
.rtwapwcm_share_pop_title { margin: 0 0 10px; font-size: 15px; font-weight: 700; line-height: 1.35; color: var(--rtwapwcm-dash-ink); }

@media screen and (max-width: 782px) {
	/* phones: the rows stack; every button is a full 44px touch target */
	.rtwapwcm_share_card .rtwapwcm_dash_block_head { padding-top: var(--rtwapwcm-dash-pad); }
	.rtwapwcm_share_body { padding-bottom: var(--rtwapwcm-dash-pad); }
	.rtwapwcm_share_rows { grid-template-columns: minmax(0, 1fr); gap: 12px; }
	button.rtwapwcm_share_copy { min-width: 44px; height: 44px; }
	.rtwapwcm_share_field { min-height: 50px; }
	.rtwapwcm_share_shortcut_two button.rtwapwcm_share_shortcut_btn { width: 44px; height: 44px; }
}

/* ==========================================================================
   Wallet passbook (3.1.1) - Payout tab, both dashboard layouts
   Every change to the wallet: credit, debit, the balance before and after.
   On a phone each row becomes a small card, label on the left.
   ========================================================================== */
.rtwapwcm_dash_block_passbook .rtwapwcm_pb_head {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
	gap: 12px 24px;
}
.rtwapwcm_pb_balance { display: flex; flex-direction: column; align-items: flex-end; min-width: 150px; }
.rtwapwcm_pb_balance_label {
	font-size: var(--rtwapwcm-dash-micro);
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--rtwapwcm-dash-muted);
}
.rtwapwcm_pb_balance_value { font-size: 22px; font-weight: 700; line-height: 1.3; color: var(--rtwapwcm-dash-ink); }
.rtwapwcm_pb_pending {
	margin: 8px var(--rtwapwcm-dash-pad) 0;
	padding: 10px 12px;
	border-radius: 8px;
	background: var(--rtwapwcm-dash-warn-soft);
	color: var(--rtwapwcm-dash-warn);
	font-size: var(--rtwapwcm-dash-small);
	line-height: 1.5;
}
.rtwapwcm_pb_scroll { overflow-x: auto; padding: 12px var(--rtwapwcm-dash-pad) 4px; }
.rtwapwcm_pb_table { width: 100%; border-collapse: collapse; font-size: var(--rtwapwcm-dash-small); color: var(--rtwapwcm-dash-ink); }
.rtwapwcm_pb_table th {
	padding: 8px 10px;
	border-bottom: 1px solid var(--rtwapwcm-dash-line);
	font-size: var(--rtwapwcm-dash-micro);
	font-weight: 600;
	letter-spacing: .04em;
	text-align: left;
	text-transform: uppercase;
	white-space: nowrap;
	color: var(--rtwapwcm-dash-muted);
	background: transparent;
}
.rtwapwcm_pb_table td { padding: 10px; border-bottom: 1px solid var(--rtwapwcm-dash-line); vertical-align: top; background: transparent; }
.rtwapwcm_pb_table tbody tr:last-child td { border-bottom: 0; }
.rtwapwcm_pb_table .rtwapwcm_pb_num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.rtwapwcm_pb_date { white-space: nowrap; color: var(--rtwapwcm-dash-muted); }
.rtwapwcm_pb_title { display: block; font-weight: 600; }
.rtwapwcm_pb_ref { display: block; margin-top: 2px; font-size: var(--rtwapwcm-dash-micro); color: var(--rtwapwcm-dash-muted); }
.rtwapwcm_pb_in { color: #0a7a46; }
.rtwapwcm_pb_out { color: #b42318; }
.rtwapwcm_pb_close { font-weight: 600; }
.rtwapwcm_pb_status {
	display: inline-block;
	padding: 2px 9px;
	border-radius: 999px;
	font-size: var(--rtwapwcm-dash-micro);
	font-weight: 600;
	white-space: nowrap;
	background: var(--rtwapwcm-dash-raise);
	color: var(--rtwapwcm-dash-muted);
}
.rtwapwcm_pb_status_credit { background: #e7f6ee; color: #0a7a46; }
.rtwapwcm_pb_status_debit { background: #fdecea; color: #b42318; }
.rtwapwcm_pb_status_pending { background: var(--rtwapwcm-dash-warn-soft); color: var(--rtwapwcm-dash-warn); }
.rtwapwcm_pb_empty td { padding: 18px 10px; text-align: center; color: var(--rtwapwcm-dash-muted); }
/* a withdrawal request still waiting: tinted so it is not read as settled (the row's class is not the notice's) */
.rtwapwcm_pb_row_pending { background: var(--rtwapwcm-dash-warn-soft); }
.rtwapwcm_pb_pager {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 12px;
	padding: 8px var(--rtwapwcm-dash-pad) var(--rtwapwcm-dash-pad);
	font-size: var(--rtwapwcm-dash-small);
}
.rtwapwcm_pb_pager[hidden] { display: none; }
.rtwapwcm_pb_pager button {
	min-height: 36px;
	padding: 0 14px;
	border: 1px solid var(--rtwapwcm-dash-line);
	border-radius: 8px;
	background: var(--rtwapwcm-dash-surface);
	color: var(--rtwapwcm-dash-ink);
	font: inherit;
	font-weight: 600;
	cursor: pointer;
}
.rtwapwcm_pb_pager button:disabled { opacity: .45; cursor: default; }
.rtwapwcm_pb_pager button:not(:disabled):hover { border-color: var(--rtwapwcm-dash-accent); color: var(--rtwapwcm-dash-accent); }
.rtwapwcm_pb_where { color: var(--rtwapwcm-dash-muted); }
.rtwapwcm_pb_error { margin: 0 var(--rtwapwcm-dash-pad) var(--rtwapwcm-dash-pad); color: #b42318; font-size: var(--rtwapwcm-dash-small); }
.rtwapwcm_pb_error[hidden] { display: none; }
.rtwapwcm_pb_pending[hidden] { display: none; }
.rtwapwcm_dash_block_passbook.is-busy .rtwapwcm_pb_body { opacity: .5; transition: opacity .15s; }

@media (max-width: 760px) {
	.rtwapwcm_pb_balance { align-items: flex-start; }
	.rtwapwcm_pb_table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
	.rtwapwcm_pb_table,
	.rtwapwcm_pb_table tbody,
	.rtwapwcm_pb_table tr,
	.rtwapwcm_pb_table td { display: block; width: 100%; }
	.rtwapwcm_pb_table tr { margin: 0 0 10px; padding: 6px 12px; border: 1px solid var(--rtwapwcm-dash-line); border-radius: 10px; }
	.rtwapwcm_pb_table td,
	.rtwapwcm_pb_table tbody tr:last-child td { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 6px 0; border: 0; text-align: right; }
	.rtwapwcm_pb_table td::before { content: attr(data-label); flex: 0 0 auto; font-size: var(--rtwapwcm-dash-micro); text-align: left; color: var(--rtwapwcm-dash-muted); }
	/* the description stays one block, title over its reference or note - listed for the last row as well, whose
	   tr:last-child rule above would otherwise set the opening balance's note beside its title */
	.rtwapwcm_pb_table td.rtwapwcm_pb_what,
	.rtwapwcm_pb_table tbody tr:last-child td.rtwapwcm_pb_what { display: block; padding-bottom: 8px; border-bottom: 1px dashed var(--rtwapwcm-dash-line); text-align: left; }
	.rtwapwcm_pb_table tbody tr.rtwapwcm_pb_empty td { display: block; padding: 12px 0; text-align: center; }
	.rtwapwcm_pb_table td.rtwapwcm_pb_what::before,
	.rtwapwcm_pb_table .rtwapwcm_pb_empty td::before { content: none; }
	.rtwapwcm_pb_table .rtwapwcm_pb_num { white-space: normal; }
	.rtwapwcm_pb_pager { justify-content: space-between; }
}

/* ---------------------------------------------------------------------------
   Processing feedback (both dashboard templates, 3.1.1): the control the affiliate
   pressed shows a spinner and what is happening while its request is out
   (window.rtwapwcm_busy in each template's script), instead of a blank page-wide
   overlay that sat under the dialogs. The spinner uses the banner search's own
   animation and the text colour of the control it is in.
   --------------------------------------------------------------------------- */
.rtwapwcm_busy { cursor: progress !important; }
/* A busy button stays legible. The theme's disabled look (Storefront: button:disabled { opacity: .5 !important }) and
   Material's greyed text (rgba(0,0,0,.38) on Template 2's teal) made "Sending request…" hard to read; the class is
   doubled so these rules outrank both, hover included. */
button.rtwapwcm_busy.rtwapwcm_busy:disabled, button.rtwapwcm_busy.rtwapwcm_busy:disabled:hover,
input.rtwapwcm_busy.rtwapwcm_busy:disabled, input.rtwapwcm_busy.rtwapwcm_busy:disabled:hover,
a.rtwapwcm_busy.rtwapwcm_busy { opacity: 1 !important; }
.mdc-button.rtwapwcm_busy.rtwapwcm_busy:disabled { color: #fff; color: var(--mdc-theme-on-primary, #fff); }
/* Template 1: the pointer is still on the button after the click, and a theme's button:hover text colour (Storefront's
   Customizer: #333) outranks .rtwapwcm_btn's white while Template 1's hover darkens the background - dark grey on dark
   red, 1.4:1. A busy Template 1 button keeps its resting colours. */
.rtwapwcm_btn.rtwapwcm_busy.rtwapwcm_busy:disabled { color: #fff; background: var(--rtwapwcm-template1-primary, #1966a4); }
button.rtwapwcm_busy .rtwapwcm_busy_text, a.rtwapwcm_busy .rtwapwcm_busy_text { vertical-align: middle; }
.rtwapwcm_busy_spin {
	display: inline-block;
	box-sizing: border-box;
	width: 1em;
	height: 1em;
	margin: 0 .5em 0 0;
	vertical-align: -.15em;
	border: 2px solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	animation: rtwapwcm_banner_spin .75s linear infinite;
}
/* an <input> button, a picture label or an icon: the spinner (and the words) right after it */
.rtwapwcm_busy_after { display: inline-flex; align-items: center; margin: 0 0 0 .5em; font-size: 14px; line-height: 1.4; color: #3c4250; vertical-align: middle; }
.rtwapwcm_busy_after .rtwapwcm_busy_spin { color: var(--rtwapwcm-dash-accent, #4b6fff); }
label.rtwapwcm_busy, i.rtwapwcm_busy, div.rtwapwcm_busy, li.rtwapwcm_busy { pointer-events: none; opacity: .55; }
/* the passbook while another page of rows is on its way */
.rtwapwcm_pb_loading { display: flex; align-items: center; margin: 0 0 10px; font-size: 14px; color: #3c4250; }
.rtwapwcm_pb_loading[hidden] { display: none; }
.rtwapwcm_pb_loading .rtwapwcm_busy_spin { color: var(--rtwapwcm-dash-accent, #4b6fff); }
@media (prefers-reduced-motion: reduce) {
	.rtwapwcm_busy_spin { animation-duration: 2s; }
}