/* =============================================================
   Rooted Magazine System — front-end styles
   ============================================================= */

:root {
	--rmag-dark:    #1a1a1a;
	--rmag-green:   #1f3d2b;
	--rmag-gold:    #c9a84c;
	--rmag-gold-dk: #9a7620;
	--rmag-cream:   #f7f2ea;
	--rmag-white:   #ffffff;
	--rmag-grey:    #6b6b6b;
	--rmag-border:  #e0d4be;
	--rmag-radius:  14px;
	--rmag-shadow:  0 8px 32px rgba(0,0,0,.12);
	--rmag-trans:   all .3s ease;
}

.rmag-system { font-family: 'Georgia', 'Times New Roman', serif; }
.rmag-empty,
.rmag-please-login { font-family: sans-serif; color: var(--rmag-grey); }

/* ── ACCESS BANNER ──────────────────────────────────────────── */
.rmag-access-banner {
	background: linear-gradient(135deg, #111 0%, #2a2a2a 100%);
	border-radius: 0;
	padding: 22px 28px;
	margin-bottom: 40px;
	color: #fff;
	box-shadow: var(--rmag-shadow);
}
.rmag-access-inner { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.rmag-banner-icon  { font-size: 36px; flex-shrink: 0; }
.rmag-banner-text  { flex: 1; min-width: 200px; }
.rmag-banner-text strong { font-size: 17px; display: block; margin-bottom: 4px; }
.rmag-banner-text p      { margin: 0; font-size: 13px; opacity: .8; }

.rmag-btn-cta {
	background: var(--rmag-gold);
	color: #111;
	padding: 12px 26px;
	border-radius: 8px;
	text-decoration: none;
	font-weight: 700;
	font-size: 14px;
	white-space: nowrap;
	transition: var(--rmag-trans);
	flex-shrink: 0;
	display: inline-block;
}
.rmag-btn-cta:hover { background: var(--rmag-gold-dk); color: #fff; }

/* ── GRID LAYOUT ────────────────────────────────────────────── */
.rmag-grid { display: grid; gap: 28px; }
.rmag-cols-2 { grid-template-columns: repeat(2, 1fr); }
.rmag-cols-3 { grid-template-columns: repeat(3, 1fr); }
.rmag-cols-4 { grid-template-columns: repeat(4, 1fr); }

/* ── FEATURED FIRST CARD ────────────────────────────────────── */
.rmag-grid .rmag-featured {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: 360px 1fr;
	background: var(--rmag-dark);
	border-radius: 0;
	overflow: hidden;
	color: #fff;
	box-shadow: 0 16px 48px rgba(0,0,0,.25);
}
.rmag-featured .rmag-cover-wrap  { aspect-ratio: unset; max-height: 480px; border-radius: 0; }
.rmag-featured .rmag-cover-img   { height: 100%; width: 100%; object-fit: cover; }
.rmag-featured .rmag-card-meta   { padding: 48px 44px; display: flex; flex-direction: column; justify-content: center; }
.rmag-featured .rmag-card-title  { font-size: 30px; color: #fff; }
.rmag-featured .rmag-card-date   { color: rgba(255,255,255,.6); }
.rmag-featured .rmag-card-desc   { color: rgba(255,255,255,.85); font-size: 15px; line-height: 1.7; }
.rmag-featured .rmag-issue-tag   { color: var(--rmag-gold); }
.rmag-featured .rmag-card-read-btn { background: var(--rmag-gold); color: #111; }
.rmag-featured .rmag-card-read-btn:hover { background: var(--rmag-gold-dk); color: #fff; }
.rmag-featured .rmag-card-lock-btn { color: #111; background: var(--rmag-gold); border-color: var(--rmag-gold); }
.rmag-featured .rmag-card-lock-btn:hover { background: var(--rmag-gold-dk); color: #fff; }

/* ── REGULAR CARD ───────────────────────────────────────────── */
.rmag-card:not(.rmag-featured) {
	background: var(--rmag-white);
	border-radius: 0;
	overflow: hidden;
	box-shadow: var(--rmag-shadow);
	transition: var(--rmag-trans);
}
.rmag-card:not(.rmag-featured):hover {
	transform: translateY(-6px);
	box-shadow: 0 20px 50px rgba(0,0,0,.18);
}

/* ── COVER WRAP ─────────────────────────────────────────────── */
.rmag-cover-wrap {
	position: relative;
	overflow: hidden;
	aspect-ratio: 3 / 4;
	background: #111;
	border-radius: 0;
}
.rmag-cover-img {
	width: 100%; height: 100%;
	object-fit: cover; display: block;
	transition: transform .4s ease;
}
.rmag-card:not(.rmag-featured):hover .rmag-cover-img { transform: scale(1.05); }

/* ── LOCKED card cover ──────────────────────────────────────── */
/* Light blur so the cover image stays clearly visible. */
.rmag-locked .rmag-cover-img { filter: blur(4px) brightness(.82); }

/* ── OVERLAYS ───────────────────────────────────────────────── */
.rmag-overlay {
	position: absolute; inset: 0;
	display: flex; align-items: center; justify-content: center;
	transition: opacity .3s ease;
}
.rmag-overlay-locked  { opacity: 1; background: rgba(0,0,0,.35); }
.rmag-overlay-open    { opacity: 0; background: rgba(0,0,0,.55); }
.rmag-card:hover .rmag-overlay-open { opacity: 1; }

.rmag-overlay-inner {
	text-align: center; color: #fff;
	display: flex; flex-direction: column;
	align-items: center; gap: 10px; padding: 20px;
}
.rmag-lock-icon    { font-size: 40px; display: block; }
.rmag-overlay-label { font-size: 12px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; opacity: .9; }

.rmag-btn-unlock {
	background: var(--rmag-gold);
	color: #111;
	padding: 8px 20px;
	border-radius: 20px;
	text-decoration: none;
	font-size: 13px; font-weight: 700;
	transition: var(--rmag-trans);
}
.rmag-btn-unlock:hover { background: var(--rmag-gold-dk); color: #fff; }

.rmag-btn-read {
	background: #fff;
	color: var(--rmag-dark);
	padding: 11px 24px;
	border-radius: 24px;
	text-decoration: none;
	font-weight: 700; font-size: 14px;
	transition: var(--rmag-trans);
}
.rmag-btn-read:hover { background: var(--rmag-gold); color: #111; }

/* ── BADGES ─────────────────────────────────────────────────── */
.rmag-badge {
	position: absolute; top: 14px; left: 14px;
	padding: 4px 12px;
	border-radius: 20px;
	font-size: 10px; font-weight: 700;
	letter-spacing: .6px; text-transform: uppercase;
	pointer-events: none;
}
.rmag-badge-latest { background: var(--rmag-gold); color: #111; }
.rmag-badge-free   { background: #2e7d32; color: #fff; left: auto; right: 14px; }

/* ── CARD META ──────────────────────────────────────────────── */
.rmag-card-meta { padding: 20px 22px 24px; }
.rmag-issue-tag {
	font-size: 10px; font-weight: 700;
	letter-spacing: 1px; text-transform: uppercase;
	color: var(--rmag-gold-dk);
	display: block; margin-bottom: 6px;
}
.rmag-card-title { font-size: 17px; margin: 0 0 6px; color: var(--rmag-dark); line-height: 1.3; }
.rmag-card-date  { font-size: 12px; color: var(--rmag-grey); display: block; margin-bottom: 10px; font-family: sans-serif; }
.rmag-card-desc  { font-size: 13px; color: var(--rmag-grey); margin: 0 0 16px; line-height: 1.6; font-family: sans-serif; }

.rmag-card-read-btn,
.rmag-card-lock-btn {
	display: inline-block;
	padding: 9px 18px;
	border-radius: 6px;
	font-family: sans-serif;
	font-size: 13px; font-weight: 700;
	text-decoration: none;
	transition: var(--rmag-trans);
}
.rmag-card-read-btn { background: var(--rmag-dark); color: var(--rmag-white); }
.rmag-card-read-btn:hover { background: var(--rmag-gold); color: #111; }
.rmag-card-lock-btn { background: var(--rmag-gold); color: #111; }
.rmag-card-lock-btn:hover { background: var(--rmag-gold-dk); color: #fff; }

/* ── NO-SUB BOX / STATUS ────────────────────────────────────── */
.rmag-no-sub-box {
	background: var(--rmag-cream);
	border: 1px solid var(--rmag-border);
	border-radius: var(--rmag-radius);
	padding: 48px;
	text-align: center;
	font-family: sans-serif;
}
.rmag-no-sub-box h3 { font-size: 22px; margin-bottom: 12px; }
.rmag-no-sub-box p  { color: var(--rmag-grey); margin-bottom: 24px; }
.rmag-sub-status { font-family: sans-serif; color: var(--rmag-grey); font-size: 14px; margin-bottom: 20px; }

/* =============================================================
   VIEWER — UNLOCKED
   ============================================================= */
.rmag-viewer-wrap {
	background: #111;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 24px 64px rgba(0,0,0,.35);
}
.rmag-viewer-toolbar {
	display: flex; align-items: center; justify-content: space-between;
	padding: 16px 24px;
	background: #0a0a0a;
	border-bottom: 1px solid rgba(255,255,255,.08);
	flex-wrap: wrap; gap: 12px;
}
.rmag-viewer-label { color: #e0e0e0; font-size: 15px; font-weight: 600; font-family: 'Georgia', serif; }
.rmag-viewer-actions { display: flex; gap: 10px; align-items: center; }

.rmag-btn-dl {
	background: var(--rmag-gold);
	color: #111;
	padding: 10px 22px;
	border-radius: 6px;
	text-decoration: none;
	font-family: sans-serif; font-size: 13px; font-weight: 700;
	transition: background .2s;
}
.rmag-btn-dl:hover { background: var(--rmag-gold-dk); color: #fff; }

.rmag-btn-fs {
	background: rgba(255,255,255,.08);
	color: #fff;
	border: 1px solid rgba(255,255,255,.15);
	padding: 10px 18px;
	border-radius: 6px;
	cursor: pointer;
	font-family: sans-serif; font-size: 13px;
	transition: background .2s;
}
.rmag-btn-fs:hover { background: rgba(255,255,255,.18); }

/* "Open PDF" — opens the PDF natively. Hidden on desktop, shown on mobile. */
.rmag-btn-open {
	display: none;
	background: var(--rmag-gold);
	color: #111;
	padding: 10px 22px;
	border-radius: 6px;
	text-decoration: none;
	font-family: sans-serif; font-size: 13px; font-weight: 700;
}
.rmag-btn-open:hover { background: var(--rmag-gold-dk); color: #fff; }

.rmag-pdf-container {
	position: relative;
	width: 100%;
	height: 88vh;
	min-height: 640px;
	background: #1e1e1e;
}
.rmag-pdf-iframe {
	position: relative;
	z-index: 2;
	width: 100%; height: 100%;
	border: none; display: block;
}
/* Fallback sits behind the iframe — visible only if the iframe is blank. */
.rmag-pdf-fallback {
	position: absolute;
	inset: 0;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 14px;
	padding: 30px;
	text-align: center;
	color: #ddd;
	font-family: sans-serif;
}
/* The footer "Open Full Screen" button is mobile-only. */
.rmag-viewer-open-mobile { display: none; }

.rmag-viewer-footer {
	padding: 18px 24px;
	background: #0a0a0a;
	border-top: 1px solid rgba(255,255,255,.08);
	display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
}
.rmag-btn-dl-lg {
	background: var(--rmag-gold);
	color: #111;
	padding: 14px 36px;
	border-radius: 8px;
	text-decoration: none;
	font-family: sans-serif; font-size: 15px; font-weight: 700;
	transition: var(--rmag-trans);
}
.rmag-btn-dl-lg:hover { background: var(--rmag-gold-dk); color: #fff; transform: translateY(-2px); }

.rmag-btn-back { color: #888; text-decoration: none; font-family: sans-serif; font-size: 14px; transition: color .2s; }
.rmag-btn-back:hover { color: #fff; }

.rmag-no-pdf {
	background: var(--rmag-cream);
	border-left: 4px solid var(--rmag-gold);
	padding: 16px 20px;
	border-radius: 6px;
	font-family: sans-serif; font-size: 14px;
}

/* =============================================================
   VIEWER — PREVIEW (non-subscribers)
   ============================================================= */
.rmag-preview-wrap {
	background: #111;
	border-radius: 0;
	overflow: hidden;
	box-shadow: 0 24px 64px rgba(0,0,0,.35);
}
.rmag-preview-banner {
	background: var(--rmag-green);
	color: #fff;
	padding: 14px 24px;
	font-family: sans-serif;
	font-size: 14px;
	display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
}
.rmag-preview-pill {
	background: var(--rmag-gold);
	color: #111;
	padding: 4px 12px;
	border-radius: 20px;
	font-size: 11px; font-weight: 700;
	text-transform: uppercase; letter-spacing: .6px;
}
.rmag-preview-frame { height: 78vh; min-height: 520px; }

.rmag-blur-wrap {
	line-height: 0;
	border-radius: 0;
	background: #111;
	text-align: center;
}
.rmag-blur-cover {
	width: 100%;
	max-height: 760px;
	object-fit: contain;
	/* Lighter blur so the cover stays clearly visible. */
	filter: blur(6px) brightness(.82);
	display: block;
	margin: 0 auto;
}

.rmag-preview-cta {
	text-align: center;
	color: #fff;
	padding: 48px 32px 56px;
	background: linear-gradient(180deg, #161616 0%, #0a0a0a 100%);
}
.rmag-lock-circle { font-size: 56px; display: block; margin-bottom: 6px; }
.rmag-preview-cta h2 { font-size: 26px; color: #fff; margin: 0 0 14px; }
.rmag-preview-cta p {
	opacity: .85; line-height: 1.7;
	margin: 0 auto 28px;
	font-family: sans-serif; font-size: 15px;
	max-width: 560px;
}
.rmag-preview-actions {
	display: flex; gap: 14px; justify-content: center; flex-wrap: wrap;
}

.rmag-btn-subscribe-big {
	display: inline-block;
	background: var(--rmag-gold);
	color: #111;
	padding: 16px 40px;
	border-radius: 8px;
	text-decoration: none;
	font-weight: 700; font-size: 16px;
	font-family: sans-serif;
	transition: var(--rmag-trans);
}
.rmag-btn-subscribe-big:hover { background: var(--rmag-gold-dk); color: #fff; transform: translateY(-2px); }

.rmag-btn-buy-single {
	display: inline-block;
	background: transparent;
	color: #fff;
	border: 1px solid rgba(255,255,255,.35);
	padding: 16px 36px;
	border-radius: 8px;
	text-decoration: none;
	font-weight: 700; font-size: 16px;
	font-family: sans-serif;
	transition: var(--rmag-trans);
}
.rmag-btn-buy-single:hover { border-color: var(--rmag-gold); color: var(--rmag-gold); }

.rmag-login-note { margin-top: 18px; font-size: 13px; opacity: .65; font-family: sans-serif; }
.rmag-login-note a { color: #f5d98a; }

/* =============================================================
   PRICING TIERS
   ============================================================= */
.rmag-pricing-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
	font-family: sans-serif;
}
.rmag-tier {
	position: relative;
	background: var(--rmag-white);
	border: 1px solid var(--rmag-border);
	border-radius: var(--rmag-radius);
	overflow: hidden;
	display: flex; flex-direction: column;
	transition: var(--rmag-trans);
}
.rmag-tier:hover { transform: translateY(-6px); box-shadow: var(--rmag-shadow); }
.rmag-tier-featured { border-color: var(--rmag-gold); box-shadow: 0 12px 36px rgba(201,168,76,.25); }

.rmag-tier-flag {
	position: absolute; top: 0; right: 0;
	background: var(--rmag-gold);
	color: #111;
	font-size: 10px; font-weight: 700;
	letter-spacing: .6px; text-transform: uppercase;
	padding: 6px 14px;
	border-bottom-left-radius: 10px;
}
.rmag-tier-head {
	background: #4a4a4a;
	color: #fff;
	padding: 22px 20px;
	text-align: center;
}
.rmag-tier-featured .rmag-tier-head { background: var(--rmag-green); }
.rmag-tier-head h3 { margin: 0; font-size: 19px; color: #fff; }

.rmag-tier-body {
	padding: 28px 22px;
	display: flex; flex-direction: column;
	flex: 1;
}
.rmag-tier-price { text-align: center; margin-bottom: 4px; }
.rmag-price-cur { font-size: 18px; font-weight: 700; color: var(--rmag-grey); vertical-align: top; }
.rmag-price-amt { font-size: 46px; font-weight: 800; color: var(--rmag-dark); line-height: 1; }
.rmag-tier-tag {
	text-align: center;
	color: var(--rmag-grey);
	font-size: 13px;
	margin-bottom: 22px;
	min-height: 34px;
}
.rmag-tier-features {
	list-style: none; margin: 0 0 24px; padding: 0;
	flex: 1;
}
.rmag-tier-features li {
	padding: 9px 0 9px 26px;
	position: relative;
	font-size: 13px;
	color: #444;
	border-bottom: 1px solid #f0eadd;
}
.rmag-tier-features li:last-child { border-bottom: none; }
.rmag-tier-features li::before {
	content: "\2713";
	position: absolute; left: 0;
	color: var(--rmag-gold-dk);
	font-weight: 700;
}
.rmag-tier-btn {
	display: block;
	text-align: center;
	background: var(--rmag-dark);
	color: #fff;
	padding: 14px 16px;
	border-radius: 6px;
	text-decoration: none;
	font-weight: 700; font-size: 13px;
	text-transform: uppercase; letter-spacing: .6px;
	transition: var(--rmag-trans);
}
.rmag-tier-btn:hover { background: var(--rmag-gold); color: #111; }
.rmag-tier-featured .rmag-tier-btn { background: var(--rmag-gold); color: #111; }
.rmag-tier-featured .rmag-tier-btn:hover { background: var(--rmag-gold-dk); color: #fff; }
.rmag-tier-btn-disabled { background: #ccc; cursor: not-allowed; }
.rmag-tier-btn-disabled:hover { background: #ccc; color: #fff; }

/* ── CURRENT PLAN (active subscriber) ────────────────────────── */
.rmag-tier-current {
	border: 2px solid #2e7d32;
}
.rmag-tier-flag-current {
	background: #2e7d32 !important;
	color: #fff !important;
}
.rmag-tier-btn-current {
	display: block;
	text-align: center;
	background: #2e7d32;
	color: #fff;
	cursor: default;
}
.rmag-tier-btn-current:hover {
	background: #2e7d32;
	color: #fff;
}
.rmag-pricing-note {
	background: #eef7ee;
	border: 1px solid #bcdcbc;
	color: #1f5d23;
	border-radius: var(--rmag-radius, 14px);
	padding: 14px 22px;
	margin-bottom: 26px;
	font-family: sans-serif;
	font-size: 14px;
	text-align: center;
}

/* =============================================================
   PURCHASE HISTORY (My Issues account tab)
   ============================================================= */
.rmag-purchase-history { margin-top: 40px; }
.rmag-ph-title {
	font-family: 'Georgia', serif;
	font-size: 20px;
	margin: 0 0 16px;
	color: var(--rmag-dark, #1a1a1a);
}
.rmag-ph-empty {
	font-family: sans-serif;
	color: var(--rmag-grey, #6b6b6b);
}
.rmag-ph-table {
	width: 100%;
	border-collapse: collapse;
	font-family: sans-serif;
	font-size: 14px;
	background: #fff;
	border: 1px solid var(--rmag-border, #e0d4be);
	border-radius: var(--rmag-radius, 14px);
	overflow: hidden;
}
.rmag-ph-table th,
.rmag-ph-table td {
	padding: 12px 14px;
	text-align: left;
	border-bottom: 1px solid #f0e9da;
}
.rmag-ph-table th {
	background: #faf6ee;
	font-size: 12px;
	letter-spacing: .4px;
	text-transform: uppercase;
	color: var(--rmag-gold-dk, #9a7620);
}
.rmag-ph-table tr:last-child td { border-bottom: none; }
.rmag-ph-read {
	display: inline-block;
	background: var(--rmag-dark, #1a1a1a);
	color: #fff;
	padding: 6px 14px;
	border-radius: 5px;
	text-decoration: none;
	font-size: 12px;
	font-weight: 700;
}
.rmag-ph-read:hover { background: var(--rmag-gold, #c9a84c); color: #111; }
.rmag-ph-dash { color: #bbb; }

@media (max-width: 720px) {
	.rmag-ph-table thead { display: none; }
	.rmag-ph-table,
	.rmag-ph-table tbody,
	.rmag-ph-table tr,
	.rmag-ph-table td { display: block; width: 100%; box-sizing: border-box; }
	.rmag-ph-table tr {
		border-bottom: 2px solid #e0d4be;
		padding: 6px 0;
	}
	.rmag-ph-table td {
		border-bottom: 1px solid #f0e9da;
		display: flex;
		justify-content: space-between;
		gap: 16px;
	}
	.rmag-ph-table td::before {
		content: attr(data-label);
		font-weight: 700;
		color: var(--rmag-gold-dk, #9a7620);
		text-transform: uppercase;
		font-size: 11px;
	}
}

/* =============================================================
   RESPONSIVE
   ============================================================= */
@media (max-width: 1024px) {
	.rmag-featured { grid-template-columns: 280px 1fr; }
	.rmag-pricing-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 860px) {
	.rmag-cols-3, .rmag-cols-4 { grid-template-columns: repeat(2, 1fr); }
	.rmag-featured { grid-template-columns: 1fr; }
	.rmag-featured .rmag-cover-wrap { aspect-ratio: 16/9; max-height: 280px; }
	.rmag-featured .rmag-card-meta  { padding: 28px; }
	.rmag-featured .rmag-card-title { font-size: 22px; }
}
@media (max-width: 600px) {
	.rmag-viewer-toolbar { flex-direction: column; align-items: flex-start; }
	.rmag-viewer-footer  { flex-direction: column; }
	.rmag-pdf-container  { height: 78vh; min-height: 440px; }
	.rmag-preview-frame  { height: 64vh; min-height: 360px; }
	.rmag-preview-cta h2 { font-size: 20px; }
	.rmag-btn-subscribe-big, .rmag-btn-buy-single { padding: 14px 28px; font-size: 15px; }

	/* On phones, surface the native "Open PDF" actions and make every
	   viewer button full-width and easy to tap. */
	.rmag-btn-open { display: inline-block; }
	.rmag-viewer-open-mobile { display: block; }
	.rmag-viewer-actions {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
	}
	.rmag-viewer-actions > a,
	.rmag-viewer-actions > button {
		flex: 1;
		min-width: 130px;
		text-align: center;
		box-sizing: border-box;
	}
	.rmag-viewer-footer > a {
		width: 100%;
		text-align: center;
		box-sizing: border-box;
	}
}
@media (max-width: 540px) {
	.rmag-cols-2, .rmag-cols-3, .rmag-cols-4 { grid-template-columns: 1fr; }
	.rmag-pricing-grid { grid-template-columns: 1fr; }
	.rmag-access-inner { flex-direction: column; align-items: flex-start; }
	.rmag-btn-cta { width: 100%; text-align: center; }
	.rmag-renew-banner { flex-direction: column; align-items: flex-start; }
	.rmag-renew-btn { width: 100%; text-align: center; }
}

/* =============================================================
   MOBILE OPTIMISATION (v1.4.1)
   ============================================================= */
@media (max-width: 600px) {
	/* Tighter outer spacing on phones. */
	.rmag-access-banner { padding: 18px 18px; margin-bottom: 24px; }
	.rmag-grid { gap: 18px; }

	/* Featured card stacks: cover on top, content below. */
	.rmag-grid .rmag-featured { grid-template-columns: 1fr; }
	.rmag-featured .rmag-cover-wrap {
		aspect-ratio: 4 / 3;
		max-height: 320px;
	}
	.rmag-featured .rmag-card-meta { padding: 24px 20px; }
	.rmag-featured .rmag-card-title { font-size: 21px; }
	.rmag-featured .rmag-card-desc  { font-size: 14px; }

	/* Card action buttons go full-width and stack. */
	.rmag-card-actions {
		flex-direction: column;
		gap: 10px;
	}
	.rmag-card-actions > a,
	.rmag-card-actions > button {
		width: 100%;
		text-align: center;
		box-sizing: border-box;
		padding: 13px 16px;   /* comfortable tap target */
		font-size: 14px;
	}

	/* Banner Subscribe / View Plans buttons stack full-width. */
	.rmag-banner-actions {
		width: 100%;
		flex-direction: column;
	}
	.rmag-banner-actions > a {
		width: 100%;
		text-align: center;
		box-sizing: border-box;
	}

	/* Preview CTA buttons stack and fill the width. */
	.rmag-preview-actions {
		flex-direction: column;
	}
	.rmag-preview-actions > a,
	.rmag-preview-actions > button {
		width: 100%;
		text-align: center;
		box-sizing: border-box;
	}

	/* Buy Now modal fits small screens. */
	.rmag-modal { padding: 14px; }
	.rmag-modal-box { padding: 26px 20px 22px; }
	.rmag-modal-title { font-size: 19px; }
	.rmag-modal-opt { padding: 14px 14px; }

	/* Overlay buttons on locked covers stay tappable. */
	.rmag-overlay-inner { padding: 14px; }
	.rmag-btn-unlock { padding: 10px 22px; }

	/* My Issues claim grid: one card per row. */
	.rmag-claim-grid { grid-template-columns: 1fr; }
	.rmag-credits-banner { padding: 14px 16px; }
}

/* =============================================================
   SUBSCRIPTION RENEWAL BANNER
   ============================================================= */
.rmag-renew-banner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	flex-wrap: wrap;
	border-radius: var(--rmag-radius, 14px);
	padding: 18px 24px;
	margin-bottom: 28px;
	font-family: sans-serif;
}
.rmag-renew-soon {
	background: #fff8e6;
	border: 1px solid #e6c875;
	color: #6b5414;
}
.rmag-renew-expired {
	background: #fdecea;
	border: 1px solid #e6a59e;
	color: #7a241c;
}
.rmag-renew-text {
	font-size: 14px;
	font-weight: 600;
	flex: 1;
	min-width: 220px;
}
.rmag-renew-btn {
	flex-shrink: 0;
	white-space: nowrap;
}

/* =============================================================
   v1.3.0 — BUY NOW, ISSUE CREDITS & CLAIM UI
   ============================================================= */

/* ── Buy Now button on magazine cards ────────────────────────── */
.rmag-card-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.rmag-card-buy-btn {
	display: inline-block;
	padding: 9px 18px;
	border-radius: 6px;
	font-family: sans-serif;
	font-size: 13px;
	font-weight: 700;
	text-decoration: none;
	background: var(--rmag-gold, #c9a84c);
	color: #111;
	transition: all .25s ease;
}
.rmag-card-buy-btn:hover { background: var(--rmag-gold-dk, #9a7620); color: #fff; }
.rmag-featured .rmag-card-buy-btn { background: var(--rmag-gold, #c9a84c); color: #111; }

/* ── Credit balance banner ───────────────────────────────────── */
.rmag-credits-banner {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	border-radius: var(--rmag-radius, 14px);
	padding: 16px 24px;
	margin-bottom: 26px;
	font-family: sans-serif;
}
.rmag-credits-have {
	background: linear-gradient(135deg, #1a1a1a 0%, #2a2a2a 100%);
	color: #fff;
}
.rmag-credits-none {
	background: #faf6ee;
	border: 1px solid var(--rmag-border, #e0d4be);
	color: var(--rmag-dark, #1a1a1a);
}
.rmag-credits-num {
	font-size: 34px;
	font-weight: 800;
	line-height: 1;
	color: var(--rmag-gold, #c9a84c);
	font-family: 'Georgia', serif;
}
.rmag-credits-text { flex: 1; min-width: 200px; font-size: 14px; }
.rmag-credits-btn { flex-shrink: 0; white-space: nowrap; }

/* ── My Issues headings ──────────────────────────────────────── */
.rmag-mi-heading {
	font-family: 'Georgia', serif;
	font-size: 20px;
	margin: 26px 0 14px;
	color: var(--rmag-dark, #1a1a1a);
}

/* ── Claim panel ─────────────────────────────────────────────── */
.rmag-claim-panel { margin-top: 34px; }
.rmag-claim-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}
.rmag-claim-card {
	background: #fff;
	border: 1px solid var(--rmag-border, #e0d4be);
	border-radius: var(--rmag-radius, 14px);
	overflow: hidden;
	display: flex;
	flex-direction: column;
}
.rmag-claim-cover {
	width: 100%;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	display: block;
}
.rmag-claim-meta { padding: 14px 16px 18px; }
.rmag-claim-title {
	font-family: 'Georgia', serif;
	font-size: 15px;
	margin: 4px 0 12px;
	color: var(--rmag-dark, #1a1a1a);
}
.rmag-claim-actions { display: flex; flex-direction: column; gap: 8px; }
.rmag-claim-btn {
	display: block;
	text-align: center;
	padding: 9px 12px;
	border-radius: 6px;
	font-family: sans-serif;
	font-size: 13px;
	font-weight: 700;
	text-decoration: none;
	background: var(--rmag-dark, #1a1a1a);
	color: #fff;
	transition: all .25s ease;
}
.rmag-claim-btn:hover { background: var(--rmag-gold, #c9a84c); color: #111; }
.rmag-claim-btn-deliver {
	background: #1f3d2b;
}
.rmag-claim-btn-deliver:hover { background: var(--rmag-gold, #c9a84c); color: #111; }

/* ── Claim result notice ─────────────────────────────────────── */
.rmag-claim-notice {
	border-radius: var(--rmag-radius, 14px);
	padding: 14px 22px;
	margin-bottom: 22px;
	font-family: sans-serif;
	font-size: 14px;
	font-weight: 600;
}
.rmag-claim-ok {
	background: #eef7ee;
	border: 1px solid #bcdcbc;
	color: #1f5d23;
}
.rmag-claim-err {
	background: #fdecea;
	border: 1px solid #e6a59e;
	color: #7a241c;
}

@media (max-width: 860px) {
	.rmag-claim-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 540px) {
	.rmag-claim-grid { grid-template-columns: 1fr; }
	.rmag-credits-banner { flex-direction: column; align-items: flex-start; }
	.rmag-credits-btn { width: 100%; text-align: center; }
}

/* =============================================================
   v1.4.0 — BANNER ACTIONS, BUY NOW MODAL & ACCOUNT FORMS
   ============================================================= */

/* ── Access banner: Subscribe + View Plans buttons ───────────── */
.rmag-banner-actions {
	display: flex;
	gap: 10px;
	flex-shrink: 0;
	flex-wrap: wrap;
}
.rmag-btn-cta-alt {
	background: transparent;
	color: #fff;
	border: 1px solid rgba(255,255,255,.45);
	padding: 12px 24px;
	border-radius: 8px;
	text-decoration: none;
	font-weight: 700;
	font-size: 14px;
	white-space: nowrap;
	transition: all .25s ease;
}
.rmag-btn-cta-alt:hover { background: rgba(255,255,255,.12); color: #fff; }

/* ── Buy Now modal ───────────────────────────────────────────── */
.rmag-modal {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
}
.rmag-modal[hidden] { display: none; }
.rmag-modal-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,.66);
}
.rmag-modal-box {
	position: relative;
	background: #fff;
	border-radius: 14px;
	max-width: 560px;
	width: 100%;
	padding: 32px 30px 30px;
	box-shadow: 0 30px 80px rgba(0,0,0,.4);
	font-family: sans-serif;
}
.rmag-modal-x {
	position: absolute;
	top: 12px; right: 14px;
	background: none;
	border: none;
	font-size: 26px;
	line-height: 1;
	color: #888;
	cursor: pointer;
}
.rmag-modal-x:hover { color: #111; }
.rmag-modal-title {
	font-family: 'Georgia', serif;
	font-size: 22px;
	margin: 0 0 4px;
	color: #1a1a1a;
}
.rmag-modal-issue {
	font-size: 14px;
	font-weight: 700;
	color: #9a7620;
	margin: 0 0 6px;
}
.rmag-modal-intro {
	font-size: 14px;
	color: #6b6b6b;
	margin: 0 0 18px;
}
.rmag-modal-options {
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.rmag-modal-opt {
	display: block;
	border: 2px solid #e0d4be;
	border-radius: 10px;
	padding: 16px 18px;
	text-decoration: none;
	transition: all .2s ease;
}
.rmag-modal-opt:hover {
	border-color: #c9a84c;
	background: #faf6ee;
}
.rmag-modal-opt-name {
	display: block;
	font-size: 16px;
	font-weight: 700;
	color: #1a1a1a;
}
.rmag-modal-opt-desc {
	display: block;
	font-size: 13px;
	color: #6b6b6b;
	margin-top: 3px;
}
.rmag-modal-opt-price {
	display: inline-block;
	margin-top: 8px;
	font-size: 15px;
	font-weight: 800;
	color: #9a7620;
}
.rmag-modal-opt-print { border-color: #cd		dcc7; }

/* ── Account (login / register) forms ────────────────────────── */
.rmag-acc-box {
	max-width: 460px;
	margin: 0 auto;
	background: #fff;
	border: 1px solid #e0d4be;
	border-radius: 14px;
	padding: 34px 32px;
	font-family: sans-serif;
	box-shadow: 0 8px 32px rgba(0,0,0,.08);
}
.rmag-acc-title {
	font-family: 'Georgia', serif;
	font-size: 24px;
	margin: 0 0 6px;
	color: #1a1a1a;
}
.rmag-acc-intro {
	font-size: 14px;
	color: #6b6b6b;
	margin: 0 0 18px;
}
.rmag-acc-form { display: flex; flex-direction: column; gap: 14px; }
.rmag-acc-row { display: flex; gap: 12px; }
.rmag-acc-row .rmag-acc-label { flex: 1; }
.rmag-acc-label { display: flex; flex-direction: column; gap: 5px; }
.rmag-acc-label span { font-size: 13px; font-weight: 700; color: #1a1a1a; }
.rmag-acc-label input[type="text"],
.rmag-acc-label input[type="email"],
.rmag-acc-label input[type="password"] {
	width: 100%;
	box-sizing: border-box;
	padding: 11px 13px;
	border: 1px solid #d4c9b0;
	border-radius: 7px;
	font-size: 14px;
}
.rmag-acc-label input:focus {
	outline: none;
	border-color: #c9a84c;
}
.rmag-acc-remember {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: #6b6b6b;
}
.rmag-acc-submit {
	background: #1a1a1a;
	color: #fff;
	border: none;
	padding: 13px 20px;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	transition: background .2s ease;
}
.rmag-acc-submit:hover { background: #c9a84c; color: #111; }
.rmag-acc-alt {
	font-size: 13px;
	color: #6b6b6b;
	margin: 14px 0 0;
	text-align: center;
}
.rmag-acc-alt a { color: #9a7620; font-weight: 700; }
.rmag-acc-loggedin { font-size: 14px; }
.rmag-acc-notice {
	border-radius: 8px;
	padding: 11px 15px;
	margin-bottom: 16px;
	font-size: 13px;
	font-weight: 600;
}
.rmag-acc-ok  { background: #eef7ee; border: 1px solid #bcdcbc; color: #1f5d23; }
.rmag-acc-err { background: #fdecea; border: 1px solid #e6a59e; color: #7a241c; }

@media (max-width: 540px) {
	.rmag-acc-row { flex-direction: column; gap: 14px; }
	.rmag-banner-actions { width: 100%; }
	.rmag-btn-cta-alt { flex: 1; text-align: center; }
}

/* =============================================================
   v1.5.0 — MY SUBSCRIPTION TAB
   ============================================================= */
.rmag-sub-table {
	width: 100%;
	max-width: 520px;
	border-collapse: collapse;
	font-family: sans-serif;
	font-size: 14px;
	background: #fff;
	border: 1px solid var(--rmag-border, #e0d4be);
}
.rmag-sub-table th,
.rmag-sub-table td {
	text-align: left;
	padding: 12px 16px;
	border-bottom: 1px solid #f0e9da;
}
.rmag-sub-table th {
	width: 45%;
	background: #faf6ee;
	color: var(--rmag-gold-dk, #9a7620);
	font-weight: 700;
}
.rmag-sub-table tr:last-child th,
.rmag-sub-table tr:last-child td { border-bottom: none; }
.rmag-sub-active {
	color: #1f5d23;
	font-weight: 700;
}
.rmag-sub-expired {
	color: #7a241c;
	font-weight: 700;
}
.rmag-credits-expiry {
	display: inline-block;
	margin-top: 6px;
	font-size: 13px;
	opacity: .9;
}

/* =============================================================
   v1.6.0 — PDF.js SCROLLABLE VIEWER
   ============================================================= */
/* The PDF.js container fills the viewer box and scrolls vertically,
   so every page is reachable — including on mobile. */
.rmag-pdf-container {
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}
.rmag-pdfjs {
	width: 100%;
	min-height: 100%;
	background: #2b2b2b;
}
.rmag-pdfjs-pages {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
	padding: 14px 10px 24px;
}
.rmag-pdfjs-page {
	display: block;
	width: 100%;
	max-width: 900px;
	height: auto;
	background: #fff;
	box-shadow: 0 6px 22px rgba(0,0,0,.4);
}

/* Loading state */
.rmag-pdfjs-status {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 14px;
	min-height: 320px;
	padding: 40px 20px;
	color: #ddd;
	font-family: sans-serif;
	font-size: 14px;
	text-align: center;
}
.rmag-pdfjs-spinner {
	width: 34px;
	height: 34px;
	border: 3px solid rgba(255,255,255,.2);
	border-top-color: var(--rmag-gold, #c9a84c);
	border-radius: 50%;
	animation: rmag-spin 0.9s linear infinite;
}
@keyframes rmag-spin {
	to { transform: rotate(360deg); }
}

/* Fallback when PDF.js cannot load */
.rmag-pdfjs-fallback {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 16px;
	min-height: 320px;
	padding: 40px 24px;
	text-align: center;
	color: #ddd;
	font-family: sans-serif;
}

@media (max-width: 600px) {
	.rmag-pdfjs-pages { gap: 10px; padding: 10px 6px 20px; }
	.rmag-pdfjs-status, .rmag-pdfjs-fallback { min-height: 260px; }
}

/* ===================================================================
   Delivery — checkout city field + Buy Now print note (v1.7.0)
   =================================================================== */

.rmag-modal-print-note {
	margin: 4px 0 0;
	padding: 14px 16px;
	background: #f7f2ea;
	border-left: 4px solid #c9a84c;
	border-radius: 6px;
	font-size: 13px;
	color: #6b6b6b;
	line-height: 1.6;
}

.rooted-delivery-city {
	margin: 24px 0;
	padding: 20px 22px;
	background: #faf7f1;
	border: 1px solid #e0d4be;
	border-radius: 10px;
}
.rooted-delivery-city h3 {
	margin: 0 0 6px;
	font-size: 16px;
	color: #1a1a1a;
}
.rooted-delivery-note {
	margin: 0 0 14px;
	font-size: 13px;
	color: #6b6b6b;
	line-height: 1.6;
}
.rooted-delivery-city .rooted-delivery-city-field select {
	width: 100%;
}
.rooted-delivery-rates {
	width: 100%;
	margin-top: 14px;
	border-collapse: collapse;
	font-size: 13px;
}
.rooted-delivery-rates td {
	padding: 6px 8px;
	border-bottom: 1px solid #e8ddc6;
	color: #4a4a4a;
}
.rooted-delivery-rates td:last-child {
	text-align: right;
	font-weight: 600;
	white-space: nowrap;
}
.rooted-delivery-rates tr:last-child td {
	border-bottom: none;
}

/* ===================================================================
   v1.7.1 — Button contrast fixes
   The Buy Now button is rendered as a <button> element, so the
   theme's default <button> background can leak through. Explicitly
   reset it and force a high-contrast colour pair.
   =================================================================== */

/* Reset native <button> chrome on all our rendered buttons. */
button.rmag-card-buy-btn,
button.rmag-buy-now,
button.rmag-btn-buy-single,
button.rmag-btn-fs {
	border: none;
	cursor: pointer;
	font-family: sans-serif;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

/* The Buy Now card button — gold pill with dark text, white on hover.
   Force the colours with !important so theme styles can't dim them. */
.rmag-card-buy-btn,
button.rmag-card-buy-btn,
.rmag-buy-now {
	background: var(--rmag-gold, #c9a84c) !important;
	color: #111 !important;
	text-shadow: none !important;
	box-shadow: 0 2px 8px rgba(0,0,0,.10);
}
.rmag-card-buy-btn:hover,
button.rmag-card-buy-btn:hover,
.rmag-buy-now:hover {
	background: var(--rmag-gold-dk, #9a7620) !important;
	color: #ffffff !important;
}

/* Featured-card variant lives on a dark background — keep the gold
   button readable. */
.rmag-featured .rmag-card-buy-btn,
.rmag-featured .rmag-buy-now {
	background: var(--rmag-gold, #c9a84c) !important;
	color: #111 !important;
}
.rmag-featured .rmag-card-buy-btn:hover,
.rmag-featured .rmag-buy-now:hover {
	background: #ffffff !important;
	color: #111 !important;
}

/* The "Read Issue" dark button on white cards must stay white-on-dark. */
.rmag-card-read-btn {
	color: #ffffff !important;
}
.rmag-card-read-btn:hover {
	color: #111 !important; /* hover swaps to gold bg, so dark text. */
}

/* Any CTA on a dark background — white text everywhere. */
.rmag-access-banner .rmag-btn-cta,
.rmag-no-sub-box .rmag-btn-cta {
	color: #111 !important; /* gold button -> dark text */
}
.rmag-access-banner .rmag-btn-cta:hover {
	color: #ffffff !important; /* hover darkens bg -> white text */
}

/* Buy Now buttons inside the chooser modal — keep the chosen state visible. */
.rmag-modal-opt:hover {
	border-color: var(--rmag-gold, #c9a84c);
}
.rmag-modal-opt:hover .rmag-modal-opt-name {
	color: var(--rmag-gold-dk, #9a7620);
}

/* The big Subscribe button has white text already, but lock it in. */
.rmag-btn-subscribe-big {
	color: #111 !important;
}
.rmag-btn-subscribe-big:hover {
	color: #ffffff !important;
}

/* ===================================================================
   v1.7.5 — Searchable Delivery City (Select2 / selectWoo)
   =================================================================== */
.rooted-delivery-city .select2-container {
	width: 100% !important;
	margin-top: 4px;
}
.rooted-delivery-city .select2-container--default .select2-selection--single {
	height: 42px;
	border: 1px solid #c9c2b3;
	border-radius: 6px;
	background: #ffffff;
	padding: 4px 8px;
}
.rooted-delivery-city .select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 32px;
	color: #1a1a1a;
}
.rooted-delivery-city .select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 40px;
}
.rooted-delivery-city .select2-search--dropdown .select2-search__field {
	padding: 8px 10px;
	border-radius: 4px;
}

/* ===================================================================
   v1.7.9 — UNIFIED BUTTON STYLE
   Customer feedback: every button on the magazine system must look
   the same — dark background, white text, white border. This block
   overrides every previously-styled button class so they share one
   identity sitewide. Placed last so it wins the cascade without
   needing !important everywhere.
   =================================================================== */

/* Shared button base */
.rmag-btn-cta,
.rmag-btn-cta-alt,
.rmag-btn-unlock,
.rmag-btn-read,
.rmag-btn-open,
.rmag-btn-dl,
.rmag-btn-dl-lg,
.rmag-btn-subscribe-big,
.rmag-btn-buy-single,
.rmag-card-read-btn,
.rmag-card-lock-btn,
.rmag-card-buy-btn,
.rmag-buy-now,
button.rmag-card-buy-btn,
button.rmag-buy-now,
button.rmag-btn-buy-single {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	background: #111111 !important;
	color: #ffffff !important;
	border: 1px solid #ffffff !important;
	border-radius: 6px !important;
	padding: 11px 22px !important;
	font-family: 'Inter', 'Helvetica Neue', Arial, sans-serif !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	letter-spacing: 0.5px !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	text-shadow: none !important;
	cursor: pointer;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
	box-shadow: none !important;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	line-height: 1.2;
}

/* Hover state — invert to make the action obvious without breaking
   the dark/white/white identity. */
.rmag-btn-cta:hover,
.rmag-btn-cta-alt:hover,
.rmag-btn-unlock:hover,
.rmag-btn-read:hover,
.rmag-btn-open:hover,
.rmag-btn-dl:hover,
.rmag-btn-dl-lg:hover,
.rmag-btn-subscribe-big:hover,
.rmag-btn-buy-single:hover,
.rmag-card-read-btn:hover,
.rmag-card-lock-btn:hover,
.rmag-card-buy-btn:hover,
.rmag-buy-now:hover,
button.rmag-card-buy-btn:hover,
button.rmag-buy-now:hover,
button.rmag-btn-buy-single:hover {
	background: #ffffff !important;
	color: #111111 !important;
	border-color: #ffffff !important;
	transform: translateY(-1px);
}

/* Sizing variants: bigger CTAs keep the same look, just larger. */
.rmag-btn-subscribe-big,
.rmag-btn-dl-lg {
	padding: 14px 32px !important;
	font-size: 15px !important;
}

/* Side-by-side preview / buy area should be tidy on mobile. */
.rmag-preview-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}
.rmag-card-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
}
.rmag-card-actions .rmag-card-read-btn,
.rmag-card-actions .rmag-card-lock-btn,
.rmag-card-actions .rmag-card-buy-btn,
.rmag-card-actions .rmag-buy-now {
	/* Equal-height pills next to each other. */
	min-height: 40px;
}

/* The fullscreen-toggle button inside the PDF viewer stays subtle. */
.rmag-btn-fs {
	background: rgba(255,255,255,.06) !important;
	color: #ffffff !important;
	border: 1px solid rgba(255,255,255,.25) !important;
}
.rmag-btn-fs:hover {
	background: rgba(255,255,255,.16) !important;
}

/* The chooser modal options (Digital vs Digital + Print) — keep the
   card look but with the new identity colours on hover. */
.rmag-modal-opt {
	border: 1px solid #1a1a1a !important;
	background: #ffffff !important;
}
.rmag-modal-opt:hover {
	border-color: #c9a84c !important;
	box-shadow: 0 6px 18px rgba(0,0,0,.10);
}

/* Featured-card buttons live on a dark background already — but the
   new unified style works there too because the BUTTON itself is dark
   on dark which is hard to see. So on the featured card variant only,
   flip background to gold once more so the action pops. */
.rmag-featured .rmag-card-buy-btn,
.rmag-featured .rmag-buy-now,
.rmag-featured .rmag-card-read-btn {
	background: #c9a84c !important;
	color: #111111 !important;
	border-color: #c9a84c !important;
}
.rmag-featured .rmag-card-buy-btn:hover,
.rmag-featured .rmag-buy-now:hover,
.rmag-featured .rmag-card-read-btn:hover {
	background: #ffffff !important;
	color: #111111 !important;
	border-color: #ffffff !important;
}

/* Subtle "Back to all issues" text link — left as a plain link. */
.rmag-btn-back {
	background: transparent !important;
	border: none !important;
	color: rgba(255,255,255,.65) !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	font-weight: 500 !important;
	padding: 6px 0 !important;
}
.rmag-btn-back:hover {
	background: transparent !important;
	color: #ffffff !important;
	transform: none !important;
}

/* ===================================================================
   v1.7.10 — Squared button restyle (matches the site's MY ACCOUNT chip)
   Overrides the v1.7.9 dark/white/white rules: no border-radius, no
   white border, use the site's dark forest-green button colour.
   This block is intentionally placed AFTER 1.7.9 so it wins the
   cascade. The same `!important`s keep theme styles from leaking.
   =================================================================== */

:root {
	--rmag-btn-bg:       #1e3a32;  /* dark teal / forest green */
	--rmag-btn-bg-hover: #2a5648;  /* slightly lighter on hover */
	--rmag-btn-fg:       #ffffff;
}

.rmag-btn-cta,
.rmag-btn-cta-alt,
.rmag-btn-unlock,
.rmag-btn-read,
.rmag-btn-open,
.rmag-btn-dl,
.rmag-btn-dl-lg,
.rmag-btn-subscribe-big,
.rmag-btn-buy-single,
.rmag-card-read-btn,
.rmag-card-lock-btn,
.rmag-card-buy-btn,
.rmag-buy-now,
button.rmag-card-buy-btn,
button.rmag-buy-now,
button.rmag-btn-buy-single {
	background: var(--rmag-btn-bg) !important;
	color: var(--rmag-btn-fg) !important;
	border: none !important;
	border-radius: 0 !important;
	padding: 12px 26px !important;
	box-shadow: none !important;
	transform: none !important;
}

.rmag-btn-cta:hover,
.rmag-btn-cta-alt:hover,
.rmag-btn-unlock:hover,
.rmag-btn-read:hover,
.rmag-btn-open:hover,
.rmag-btn-dl:hover,
.rmag-btn-dl-lg:hover,
.rmag-btn-subscribe-big:hover,
.rmag-btn-buy-single:hover,
.rmag-card-read-btn:hover,
.rmag-card-lock-btn:hover,
.rmag-card-buy-btn:hover,
.rmag-buy-now:hover,
button.rmag-card-buy-btn:hover,
button.rmag-buy-now:hover,
button.rmag-btn-buy-single:hover {
	background: var(--rmag-btn-bg-hover) !important;
	color: var(--rmag-btn-fg) !important;
	border-color: transparent !important;
	transform: translateY(-1px);
}

/* The "Subscribe" big call-to-action under the preview lock — same
   identity but a touch larger so it reads as the primary action. */
.rmag-btn-subscribe-big,
.rmag-btn-dl-lg {
	padding: 15px 34px !important;
}

/* Featured-card buttons no longer need a gold flip — keep them on
   the unified style for full consistency. */
.rmag-featured .rmag-card-buy-btn,
.rmag-featured .rmag-buy-now,
.rmag-featured .rmag-card-read-btn {
	background: var(--rmag-btn-bg) !important;
	color: var(--rmag-btn-fg) !important;
	border-color: transparent !important;
}
.rmag-featured .rmag-card-buy-btn:hover,
.rmag-featured .rmag-buy-now:hover,
.rmag-featured .rmag-card-read-btn:hover {
	background: var(--rmag-btn-bg-hover) !important;
	color: var(--rmag-btn-fg) !important;
}

/* Card containers — drop the rounded corners on the magazine cards
   themselves so the squared aesthetic carries through end-to-end. */
.rmag-card,
.rmag-card .rmag-cover-wrap,
.rmag-card .rmag-cover-img,
.rmag-access-banner,
.rmag-viewer-wrap,
.rmag-viewer-locked,
.rmag-no-sub-box {
	border-radius: 0 !important;
}

/* The fullscreen button keeps its subtle viewer style but loses its
   rounded corner to stay on-brand. */
.rmag-btn-fs {
	border-radius: 0 !important;
}

/* The "Back to all issues" plain text link — stays a link, no chrome. */
.rmag-btn-back {
	border-radius: 0 !important;
}
