.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%; }
}