/*
 * Capital Pulse — additions on top of the AdminUIUX stylesheet.
 * Deliberately thin: the purchased theme stays in charge of colour and
 * component styling. Nothing here changes the palette.
 */

/* ------------------------------------------------------------------
   1. Deposit account cards
   ------------------------------------------------------------------ */

.cp-account-card {
	cursor: pointer;
	transition: border-color .15s ease, box-shadow .15s ease;
}

.cp-account-card.cp-selected {
	border-color: var(--adminuiux-theme-1) !important;
	box-shadow: 0 0 0 2px rgba(var(--adminuiux-theme-1-rgb, 47, 90, 255), .12);
}

.cp-copy.cp-copied i::before {
	content: "\F26E"; /* bi-check-lg */
}

.cp-copy-value {
	word-break: break-all;
}

/* ------------------------------------------------------------------
   2. Images — consistent sizing, no stretching
   ------------------------------------------------------------------ */

/* The theme's coverimg script sets object-fit on load; this covers the
   moment before it runs so images never flash out of proportion. */
.coverimg img,
figure.avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

/* Anything dropped into a card should never overflow it */
.adminuiux-card img {
	max-width: 100%;
	height: auto;
}

/* Member-uploaded proof and QR images */
.cp-proof-img {
	max-width: 100%;
	max-height: 220px;
	width: auto;
	height: auto;
	border-radius: .5rem;
	object-fit: contain;
}

.cp-qr-img {
	width: 150px;
	height: 150px;
	object-fit: contain;
}

/* Auth panel artwork keeps its proportions on every breakpoint */
.auth-wrapper .card-body img {
	max-width: 100%;
	height: auto;
}

/* ------------------------------------------------------------------
   3. Icons

   Nothing here resizes or recolours icons. The template already styles
   both icon sets (Feather SVG in the menus, Bootstrap Icons elsewhere),
   and overriding it is what made them look off. Only the icon font path
   in app.css needed fixing, which is done at the source.
   ------------------------------------------------------------------ */

/* ------------------------------------------------------------------
   4. Compact density — applied when body has .cp-compact
   Scales the template down a step so pages hold more without feeling
   cramped. Switch to Comfortable in Settings to get the original sizing.
   ------------------------------------------------------------------ */

.cp-compact .adminuiux-card .card-body {
	padding: 1rem;
}

.cp-compact .adminuiux-card .card-header {
	padding: .75rem 1rem;
}

/* Headline numbers on the stat cards */
.cp-compact .adminuiux-content h1 {
	font-size: 1.9rem;
}

.cp-compact .adminuiux-content h2 {
	font-size: 1.5rem;
}

.cp-compact .adminuiux-content h3 {
	font-size: 1.3rem;
}

.cp-compact .adminuiux-content h4 {
	font-size: 1.15rem;
}

.cp-compact .adminuiux-content h5 {
	font-size: 1.02rem;
}

.cp-compact .adminuiux-content h6 {
	font-size: .92rem;
}

/* The oversized hero figures on wallet and withdraw */
.cp-compact .adminuiux-card.bg-theme-1 h1 {
	font-size: 2.1rem;
}

/* Vertical rhythm between rows of cards */
.cp-compact .adminuiux-content .mb-4 {
	margin-bottom: 1rem !important;
}

.cp-compact .adminuiux-content .mt-4 {
	margin-top: 1rem !important;
}

.cp-compact .adminuiux-content .py-5 {
	padding-top: 2rem !important;
	padding-bottom: 2rem !important;
}

/* Tables carry most of the content, so tighten them a touch more */
.cp-compact .table > :not(caption) > * > * {
	padding-top: .55rem;
	padding-bottom: .55rem;
}

.cp-compact .table p {
	margin-bottom: 0;
}

/* Avatars inside dense table rows */
.cp-compact .table .avatar-40 {
	width: 34px;
	height: 34px;
	min-width: 34px;
}

/* Forms */
.cp-compact .form-floating > .form-control,
.cp-compact .form-floating > .form-select {
	min-height: 3.1rem;
}

.cp-compact .form-floating > label {
	padding-top: .85rem;
}

/* Chart panels do not need the full 300px on compact */
.cp-compact .height-300 {
	height: 250px;
}

/* Leave the empty-state blocks breathing room even when compact */
.cp-compact .cp-empty {
	padding: 2.5rem 1rem;
}

/* ------------------------------------------------------------------
   5. Small fixes
   ------------------------------------------------------------------ */

.mt--2 {
	margin-top: -.5rem;
}

.adminuiux-card .table > :not(caption) > * > * {
	background-color: transparent;
}

.adminuiux-content .alert {
	margin-bottom: 1rem;
}

/* Tables should scroll rather than break the card on small screens */
.table-responsive {
	-webkit-overflow-scrolling: touch;
}

@media (max-width: 575.98px) {
	.cp-compact .adminuiux-content h1 {
		font-size: 1.6rem;
	}

	.cp-form .row > [class*="col-"] {
		margin-bottom: .25rem;
	}
}

/* ------------------------------------------------------------------
   6. Mobile app-style bottom bar

   The theme styles .adminuiux-mobile-footer's contents but ships no rule
   for the container itself, because the investment pages never used one.
   These few lines position it and give it a surface that follows the
   template's own light/dark variables. No colours are invented.
   ------------------------------------------------------------------ */

.adminuiux-mobile-footer {
	background-color: var(--bs-body-bg);
	border-top: 1px solid var(--bs-border-color);
	padding: .5rem .25rem calc(.5rem + env(safe-area-inset-bottom));
	transition: bottom .25s ease;
	z-index: 1030;
}

/* Room for the bar so it never covers the last card or the footer */
@media (max-width: 991.98px) {
	.adminuiux-wrap,
	.adminuiux-footer {
		padding-bottom: 5.5rem;
	}

	/* The palette button would sit under the bar otherwise */
}

/* Phones: give the content real edge spacing rather than a desktop gutter */
@media (max-width: 575.98px) {
	.adminuiux-content .container,
	.adminuiux-content .container-fluid {
		padding-left: 1rem;
		padding-right: 1rem;
	}

	/* Stat cards read better side by side than stacked on a narrow screen */
	.adminuiux-content .card-body {
		padding: .9rem;
	}

	/* Tables scroll instead of squeezing the text to nothing */
	.table {
		min-width: 520px;
	}

	/* Full-width primary actions, the way an app would do it */
	.cp-form .btn-theme,
	.cp-form .btn-outline-theme {
		width: 100%;
	}
}

/* ------------------------------------------------------------------
   7. Header icon buttons

   The template gives these no background at all — .btn-square only sets
   size, and the only .btn-link background rule is scoped to .btn-group.
   Forcing it here so the icons stay flat like the demo regardless of
   what a theme toggle or a stale cookie leaves behind.
   ------------------------------------------------------------------ */

.adminuiux-header .navbar .btn-link-header,
.adminuiux-header .navbar .sidebar-toggler,
.adminuiux-header .navbar .btn-link.btn-square {
	--bs-btn-bg: transparent;
	--bs-btn-border-color: transparent;
	background-color: transparent;
	border-color: transparent;
	box-shadow: none;
}

.adminuiux-header .navbar .btn-link-header:hover,
.adminuiux-header .navbar .sidebar-toggler:hover {
	background-color: rgba(var(--adminuiux-theme-1-rgb), .1);
}

/* ------------------------------------------------------------------
   8. Plan cards
   ------------------------------------------------------------------ */

.cp-plan-card {
	overflow: hidden;
	transition: transform .18s ease, box-shadow .18s ease;
}

.cp-plan-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 12px 28px rgba(0, 0, 0, .09);
}

/* Accent band across the top, tinted from the active theme */
.cp-plan-card .cp-plan-head {
	background: linear-gradient(135deg,
		rgba(var(--adminuiux-theme-1-rgb), .14),
		rgba(var(--adminuiux-theme-1-rgb), .03));
	padding: 1.4rem 1.25rem 1.1rem;
	position: relative;
}

.cp-plan-card .cp-plan-rate {
	font-size: 2.1rem;
	font-weight: 600;
	line-height: 1.1;
	color: var(--adminuiux-theme-1);
}

.cp-plan-card .cp-plan-badge {
	position: absolute;
    top: 1rem;
	right: 1rem;
}

/* Min / term / cycle grid */
.cp-plan-meta {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: .25rem;
	border-top: 1px solid var(--bs-border-color);
	border-bottom: 1px solid var(--bs-border-color);
	margin: 0 0 1rem;
	padding: .85rem 0;
	text-align: center;
}

.cp-plan-meta > div + div {
	border-left: 1px solid var(--bs-border-color);
}

.cp-plan-meta .cp-plan-meta-value {
	display: block;
	font-weight: 600;
	font-size: .95rem;
}

.cp-plan-meta .cp-plan-meta-label {
	display: block;
	font-size: .72rem;
	color: var(--bs-secondary);
	text-transform: uppercase;
	letter-spacing: .04em;
}

.cp-plan-features li {
	padding: .2rem 0;
}

/* ------------------------------------------------------------------
   9. Deposit — two-step flow
   ------------------------------------------------------------------ */

.cp-steps {
	display: flex;
	align-items: center;
	gap: .75rem;
	margin-bottom: 1.5rem;
}

.cp-steps .cp-step {
	display: flex;
	align-items: center;
	gap: .5rem;
	color: var(--bs-secondary);
	font-size: .9rem;
}

.cp-steps .cp-step-num {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 600;
	font-size: .85rem;
	background: rgba(var(--adminuiux-theme-1-rgb), .12);
	color: var(--adminuiux-theme-1);
	flex: 0 0 auto;
}

.cp-steps .cp-step.is-active {
	color: var(--bs-body-color);
	font-weight: 600;
}

.cp-steps .cp-step.is-active .cp-step-num,
.cp-steps .cp-step.is-done .cp-step-num {
	background: var(--adminuiux-theme-1);
	color: #fff;
}

.cp-steps .cp-step-line {
	flex: 1 1 auto;
	height: 2px;
	background: var(--bs-border-color);
	min-width: 20px;
}

/* Confirmed details panel on step 2 */
.cp-pay-to {
	background: rgba(var(--adminuiux-theme-1-rgb), .05);
	border: 1px dashed rgba(var(--adminuiux-theme-1-rgb), .35);
	border-radius: var(--bs-border-radius-lg, .75rem);
	padding: 1.15rem;
}

.cp-pay-to .cp-pay-row + .cp-pay-row {
	margin-top: .75rem;
	padding-top: .75rem;
	border-top: 1px solid var(--bs-border-color);
}

.cp-pay-number {
	font-size: 1.15rem;
	font-weight: 600;
	letter-spacing: .02em;
	word-break: break-all;
}

@media (max-width: 575.98px) {
	.cp-steps .cp-step span:not(.cp-step-num) {
		display: none;
	}

	.cp-plan-card .cp-plan-rate {
		font-size: 1.8rem;
	}
}

/* ------------------------------------------------------------------
   11. Deposit provider tiles

   The tiles are ordinary theme cards, so they inherit the template's own
   surface and border. Only the selected state is added, drawn from the
   active theme colour — no background is set here.
   ------------------------------------------------------------------ */

.cp-provider {
	text-decoration: none;
	transition: border-color .15s ease, box-shadow .15s ease;
}

.cp-provider:hover {
	border-color: rgba(var(--adminuiux-theme-1-rgb), .5) !important;
}

.cp-provider.is-selected {
	border-color: var(--adminuiux-theme-1) !important;
	box-shadow: 0 0 0 2px rgba(var(--adminuiux-theme-1-rgb), .15);
}

.cp-provider.is-selected .avatar {
	background-color: var(--adminuiux-theme-1) !important;
	color: #fff !important;
}

/* ------------------------------------------------------------------
   12. Stacking

   Modals must clear the fixed mobile bar and the palette button.
   Position only — no colours are set anywhere in this file.
   ------------------------------------------------------------------ */

.modal {
	z-index: 1080;
}

.modal-backdrop {
	z-index: 1070;
}

/* ------------------------------------------------------------------
   13. Modal spacing on small screens
   ------------------------------------------------------------------ */

@media (max-width: 767.98px) {
	.modal-dialog {
		margin: .75rem;
	}
}

/* ------------------------------------------------------------------
   14. Beating theme button styles

   Belt and braces for the rule above. WordPress themes commonly ship
   `button:not(:hover):not(:active):not(.has-background) { background-color:
   var(--global--color-primary) }`. That selector scores higher than
   Bootstrap's `.btn`, so it repaints every button in the theme's colour.
   Dequeuing theme CSS on these pages is the real fix; this matches that
   specificity so a theme loaded some other way still cannot win.

   Colours come from Bootstrap's own button variables, which the theme
   palette feeds — nothing is hardcoded.
   ------------------------------------------------------------------ */

.adminuiux-wrap button.btn:not(:hover):not(:active),
.adminuiux-wrap a.btn:not(:hover):not(:active),
.modal button.btn:not(:hover):not(:active),
.modal a.btn:not(:hover):not(:active),
.adminuiux-header button.btn:not(:hover):not(:active),
.adminuiux-content button.btn:not(:hover):not(:active) {
	background-color: var(--bs-btn-bg);
	border-color: var(--bs-btn-border-color);
	color: var(--bs-btn-color);
}

/* btn-link and btn-square carry no fill of their own */
.adminuiux-wrap button.btn-link:not(:hover):not(:active),
.adminuiux-wrap a.btn-link:not(:hover):not(:active),
.modal button.btn-link:not(:hover):not(:active),
.adminuiux-header button.btn-link:not(:hover):not(:active) {
	background-color: var(--bs-btn-bg, transparent);
}

/* The modal close control is an icon, never a filled block */
.modal button.btn-close:not(:hover):not(:active) {
	background-color: transparent;
	border-color: transparent;
}

/* File inputs pick up theme button styling too */
.adminuiux-wrap input[type="file"]:not(:hover):not(:active),
.modal input[type="file"]:not(:hover):not(:active) {
	background-color: var(--bs-body-bg);
	color: var(--bs-body-color);
}

/* ------------------------------------------------------------------
   15. Card scale — deposit, withdraw and investment plans only

   Roughly 20% down on type and padding, scoped to those three screens
   through the route class on <body>. Every other page keeps the
   template's own sizing. Sizes only — no colours.
   ------------------------------------------------------------------ */

.cp-route-deposit .adminuiux-card .card-body,
.cp-route-withdraw .adminuiux-card .card-body,
.cp-route-plans .adminuiux-card .card-body,
.cp-route-plan .adminuiux-card .card-body {
	padding: .8rem;
}

.cp-route-deposit .adminuiux-card .card-header,
.cp-route-withdraw .adminuiux-card .card-header,
.cp-route-plans .adminuiux-card .card-header,
.cp-route-plan .adminuiux-card .card-header {
	padding: .6rem .8rem;
}

.cp-route-deposit .adminuiux-card h1,
.cp-route-withdraw .adminuiux-card h1,
.cp-route-plans .adminuiux-card h1,
.cp-route-plan .adminuiux-card h1 {
	font-size: 1.55rem;
}

.cp-route-deposit .adminuiux-card h2,
.cp-route-withdraw .adminuiux-card h2,
.cp-route-plans .adminuiux-card h2,
.cp-route-plan .adminuiux-card h2 {
	font-size: 1.25rem;
}

.cp-route-deposit .adminuiux-card h3,
.cp-route-withdraw .adminuiux-card h3,
.cp-route-plans .adminuiux-card h3,
.cp-route-plan .adminuiux-card h3 {
	font-size: 1.1rem;
}

.cp-route-deposit .adminuiux-card h4,
.cp-route-withdraw .adminuiux-card h4,
.cp-route-plans .adminuiux-card h4,
.cp-route-plan .adminuiux-card h4 {
	font-size: .96rem;
}

.cp-route-deposit .adminuiux-card h5,
.cp-route-withdraw .adminuiux-card h5,
.cp-route-plans .adminuiux-card h5,
.cp-route-plan .adminuiux-card h5 {
	font-size: .88rem;
}

.cp-route-deposit .adminuiux-card h6,
.cp-route-withdraw .adminuiux-card h6,
.cp-route-plans .adminuiux-card h6,
.cp-route-plan .adminuiux-card h6 {
	font-size: .8rem;
}

.cp-route-deposit .adminuiux-card p,
.cp-route-withdraw .adminuiux-card p,
.cp-route-plans .adminuiux-card p,
.cp-route-plan .adminuiux-card p {
	font-size: .84rem;
}

.cp-route-deposit .adminuiux-card .small,
.cp-route-withdraw .adminuiux-card .small,
.cp-route-plans .adminuiux-card .small,
.cp-route-plan .adminuiux-card .small,
.cp-route-deposit .adminuiux-card small,
.cp-route-withdraw .adminuiux-card small,
.cp-route-plans .adminuiux-card small,
.cp-route-plan .adminuiux-card small {
	font-size: .72rem;
}

.cp-route-deposit .adminuiux-card .badge,
.cp-route-withdraw .adminuiux-card .badge,
.cp-route-plans .adminuiux-card .badge,
.cp-route-plan .adminuiux-card .badge {
	font-size: .68rem;
}

.cp-route-deposit .cp-plan-card .cp-plan-head,
.cp-route-withdraw .cp-plan-card .cp-plan-head,
.cp-route-plans .cp-plan-card .cp-plan-head,
.cp-route-plan .cp-plan-card .cp-plan-head {
	padding: 1.1rem 1rem .9rem;
}

.cp-route-deposit .cp-plan-card .cp-plan-rate,
.cp-route-withdraw .cp-plan-card .cp-plan-rate,
.cp-route-plans .cp-plan-card .cp-plan-rate,
.cp-route-plan .cp-plan-card .cp-plan-rate {
	font-size: 1.7rem;
}

.cp-route-deposit .cp-plan-meta,
.cp-route-withdraw .cp-plan-meta,
.cp-route-plans .cp-plan-meta,
.cp-route-plan .cp-plan-meta {
	padding: .68rem 0;
	margin-bottom: .8rem;
}

.cp-route-deposit .cp-plan-meta .cp-plan-meta-value,
.cp-route-withdraw .cp-plan-meta .cp-plan-meta-value,
.cp-route-plans .cp-plan-meta .cp-plan-meta-value,
.cp-route-plan .cp-plan-meta .cp-plan-meta-value {
	font-size: .8rem;
}

.cp-route-deposit .cp-plan-meta .cp-plan-meta-label,
.cp-route-withdraw .cp-plan-meta .cp-plan-meta-label,
.cp-route-plans .cp-plan-meta .cp-plan-meta-label,
.cp-route-plan .cp-plan-meta .cp-plan-meta-label {
	font-size: .62rem;
}

.cp-route-deposit .cp-pay-number,
.cp-route-withdraw .cp-pay-number,
.cp-route-plans .cp-pay-number,
.cp-route-plan .cp-pay-number {
	font-size: .95rem;
}

.cp-route-deposit .cp-pay-to,
.cp-route-withdraw .cp-pay-to,
.cp-route-plans .cp-pay-to,
.cp-route-plan .cp-pay-to {
	padding: .9rem;
}

.cp-route-deposit .adminuiux-card .avatar-60,
.cp-route-withdraw .adminuiux-card .avatar-60,
.cp-route-plans .adminuiux-card .avatar-60,
.cp-route-plan .adminuiux-card .avatar-60 {
	width: 48px;
	height: 48px;
	min-width: 48px;
}

.cp-route-deposit .adminuiux-card .avatar-50,
.cp-route-withdraw .adminuiux-card .avatar-50,
.cp-route-plans .adminuiux-card .avatar-50,
.cp-route-plan .adminuiux-card .avatar-50 {
	width: 40px;
	height: 40px;
	min-width: 40px;
}

.cp-route-deposit .adminuiux-card .avatar-40,
.cp-route-withdraw .adminuiux-card .avatar-40,
.cp-route-plans .adminuiux-card .avatar-40,
.cp-route-plan .adminuiux-card .avatar-40 {
	width: 34px;
	height: 34px;
	min-width: 34px;
}

.cp-route-deposit .adminuiux-card .table,
.cp-route-withdraw .adminuiux-card .table,
.cp-route-plans .adminuiux-card .table,
.cp-route-plan .adminuiux-card .table {
	font-size: .82rem;
}

.cp-route-deposit .adminuiux-card .table > :not(caption) > * > *,
.cp-route-withdraw .adminuiux-card .table > :not(caption) > * > *,
.cp-route-plans .adminuiux-card .table > :not(caption) > * > *,
.cp-route-plan .adminuiux-card .table > :not(caption) > * > * {
	padding-top: .45rem;
	padding-bottom: .45rem;
}

.cp-route-deposit .adminuiux-card .btn,
.cp-route-withdraw .adminuiux-card .btn,
.cp-route-plans .adminuiux-card .btn,
.cp-route-plan .adminuiux-card .btn {
	font-size: .82rem;
}

.cp-route-deposit .adminuiux-card .btn-sm,
.cp-route-withdraw .adminuiux-card .btn-sm,
.cp-route-plans .adminuiux-card .btn-sm,
.cp-route-plan .adminuiux-card .btn-sm {
	font-size: .74rem;
}

.cp-route-deposit .adminuiux-card .form-control,
.cp-route-withdraw .adminuiux-card .form-control,
.cp-route-plans .adminuiux-card .form-control,
.cp-route-plan .adminuiux-card .form-control,
.cp-route-deposit .adminuiux-card .form-select,
.cp-route-withdraw .adminuiux-card .form-select,
.cp-route-plans .adminuiux-card .form-select,
.cp-route-plan .adminuiux-card .form-select {
	font-size: .85rem;
}

.cp-route-deposit .adminuiux-card .form-floating > label,
.cp-route-withdraw .adminuiux-card .form-floating > label,
.cp-route-plans .adminuiux-card .form-floating > label,
.cp-route-plan .adminuiux-card .form-floating > label {
	font-size: .85rem;
}

.cp-route-deposit .adminuiux-card.bg-theme-1 h1,
.cp-route-withdraw .adminuiux-card.bg-theme-1 h1,
.cp-route-plans .adminuiux-card.bg-theme-1 h1,
.cp-route-plan .adminuiux-card.bg-theme-1 h1 {
	font-size: 1.7rem;
}

/* Popups opened from those pages */
.modal .cp-pay-to { padding: .9rem; }
.modal .cp-pay-number { font-size: .95rem; }

@media (max-width: 575.98px) {
	.cp-route-deposit .adminuiux-card h1 { font-size: 1.35rem; }
	.cp-route-deposit .cp-plan-card .cp-plan-rate { font-size: 1.45rem; }
	.cp-route-withdraw .adminuiux-card h1 { font-size: 1.35rem; }
	.cp-route-withdraw .cp-plan-card .cp-plan-rate { font-size: 1.45rem; }
	.cp-route-plans .adminuiux-card h1 { font-size: 1.35rem; }
	.cp-route-plans .cp-plan-card .cp-plan-rate { font-size: 1.45rem; }
	.cp-route-plan .adminuiux-card h1 { font-size: 1.35rem; }
	.cp-route-plan .cp-plan-card .cp-plan-rate { font-size: 1.45rem; }
}

/* ------------------------------------------------------------------
   16. Card overflow guards

   Long account titles and provider names must truncate rather than push
   a button out of its card. Sizes and overflow only.
   ------------------------------------------------------------------ */

.min-width-0 {
	min-width: 0;
}

.cp-plan-card .text-truncate {
	max-width: 100%;
}

/* Action buttons stack instead of spilling sideways */
.cp-plan-card .d-grid .btn {
	white-space: nowrap;
}

/* The popup step bar sits tight to the content above it */
.modal .cp-steps {
	margin-bottom: 1rem;
}

/* ------------------------------------------------------------------
   17. Risk notice

   The body comes from an editor, so it arrives wrapped in paragraphs.
   Tighten the spacing so it reads as one block rather than a stack.
   ------------------------------------------------------------------ */

.cp-risk-body p {
	margin-bottom: .35rem;
}

.cp-risk-body p:last-child {
	margin-bottom: 0;
}

.cp-risk-body ul,
.cp-risk-body ol {
	margin-bottom: .35rem;
	padding-left: 1.2rem;
}

/* ==================================================================
   18. Responsive pass

   Sizes and wrapping only. Nothing here sets a colour.
   ================================================================== */

/* ---- Modal scrolling ----------------------------------------------
   Bootstrap sizes a scrollable dialog with height, then caps the content.
   Overriding max-height alone left the body with nothing to scroll
   against, so a tall form ran off the bottom with no way to reach the
   submit button.
   ------------------------------------------------------------------ */

/* Measured against the viewport rather than the parent chain.
 *
 * The percentage version only works if every ancestor has a resolved
 * height, and the template's build dropped the Bootstrap rule that gives
 * the dialog one. Viewport units do not care what the ancestors do, so
 * the body always has something to scroll inside. */
.modal-dialog-scrollable {
	height: auto !important;
	max-height: calc(100vh - 3rem) !important;
}

.modal-dialog-scrollable .modal-content {
	max-height: calc(100vh - 3rem) !important;
	overflow: hidden !important;
}

.modal-dialog-scrollable .modal-body {
	overflow-y: auto !important;
	-webkit-overflow-scrolling: touch;
}

/* Header and footer keep their size so only the middle scrolls */
.modal-dialog-scrollable .modal-header,
.modal-dialog-scrollable .modal-footer {
	flex-shrink: 0;
}

@media (max-width: 767.98px) {
	.modal-dialog-scrollable {
		max-height: calc(100vh - 1.5rem) !important;
	}

	.modal-dialog-scrollable .modal-content {
		max-height: calc(100vh - 1.5rem) !important;
	}
}

/* Newer browsers: dvh accounts for the phone's collapsing address bar,
   which vh does not. */
@supports (height: 100dvh) {
	.modal-dialog-scrollable {
		max-height: calc(100dvh - 3rem) !important;
	}

	.modal-dialog-scrollable .modal-content {
		max-height: calc(100dvh - 3rem) !important;
	}

	@media (max-width: 767.98px) {
		.modal-dialog-scrollable,
		.modal-dialog-scrollable .modal-content {
			max-height: calc(100dvh - 1.5rem) !important;
		}
	}
}

/* ---- Long unbreakable values --------------------------------------
   A wallet address, an IBAN or a memo tag is one long token with no
   spaces. Left alone it pushes its card wider than the screen and the
   whole page scrolls sideways.
   ------------------------------------------------------------------ */

.cp-copy-value,
.cp-pay-number,
.cp-pay-to .fw-medium {
	word-break: break-all;
	overflow-wrap: anywhere;
	min-width: 0;
}

/* The copy button must never be squeezed out by the value beside it */
.cp-copy {
	flex: 0 0 auto;
}

/* ---- Small phones, 360px and under ------------------------------- */

@media (max-width: 360px) {
	.adminuiux-content .adminuiux-card .card-body {
		padding: .7rem;
	}

	.cp-plan-card .cp-plan-rate {
		font-size: 1.3rem;
	}

	/* Three columns of stats will not fit; stack to two */
	.cp-plan-meta {
		grid-template-columns: repeat(2, 1fr);
		gap: .5rem 0;
	}

	.cp-plan-meta > div:nth-child(3) {
		border-left: 0;
		grid-column: 1 / -1;
		padding-top: .5rem;
		border-top: 1px solid var(--bs-border-color);
	}

	.badge {
		white-space: normal;
	}
}

/* ---- Phones and small tablets ------------------------------------ */

@media (max-width: 575.98px) {
	/* Buttons that sit side by side on desktop stack instead of shrinking
	   to unreadable widths */
	.modal-footer {
		flex-direction: column-reverse;
		align-items: stretch;
	}

	.modal-footer .btn {
		width: 100%;
		margin: 0 0 .4rem;
	}

	/* Card headers with an action on the right */
	.adminuiux-card .card-header .row {
		row-gap: .5rem;
	}

	/* Page headings and their action button */
	.container-fluid > .row.gx-3 > .col-12.col-sm-auto {
		text-align: left !important;
	}

	/* Breadcrumb should wrap, not scroll */
	.breadcrumb {
		flex-wrap: wrap;
	}
}

/* ---- Tablets ----------------------------------------------------- */

@media (min-width: 576px) and (max-width: 991.98px) {
	/* Plan and account cards read better two-up than stretched wide */
	.cp-plan-card .cp-plan-rate {
		font-size: 1.55rem;
	}
}

/* ---- Very wide screens -------------------------------------------
   Beyond about 1600px the reading column becomes uncomfortably long,
   so the content is held to a sensible width rather than stretched.
   ------------------------------------------------------------------ */

@media (min-width: 1600px) {
	.adminuiux-content > .container {
		max-width: 1400px;
	}
}

/* ---- Anything, any width -----------------------------------------
   Guards that do not belong to one breakpoint.
   ------------------------------------------------------------------ */

/* Nothing should ever cause a sideways scroll.
 *
 * overflow-x: hidden on html and body together is a well-known way to
 * break vertical scrolling on iOS Safari — the page simply stops moving.
 * overflow-x: clip does the same job without creating a scroll container,
 * and the wrapper carries it rather than the document root. */
.adminuiux-wrap,
.adminuiux-content {
	overflow-x: clip;
}

/* Flex children need this or long text refuses to shrink */
.d-flex > .flex-grow-1,
.d-flex > .col,
.row > [class*="col-"] {
	min-width: 0;
}

/* Images never wider than their box */
.adminuiux-content img,
.modal img {
	max-width: 100%;
	height: auto;
}

/* QR codes scale down on narrow screens */
.cp-qr-img {
	max-width: 100%;
}

/* Tables inside modals get the same scroll treatment as elsewhere */
.modal .table-responsive {
	-webkit-overflow-scrolling: touch;
}

/* Form rows that hold two fields side by side */
@media (max-width: 480px) {
	.form-floating + .form-floating {
		margin-top: .5rem;
	}
}

/* ==================================================================
   19. Core Web Vitals

   Three things the browser needs from us: something to paint early,
   a layout that does not jump, and a main thread it can use.
   ================================================================== */

/* ---- Layout stability (CLS) ---------------------------------------

   Anything that arrives after first paint and pushes content down
   costs CLS. Reserving the space up front costs nothing.
   ------------------------------------------------------------------ */

/* The header is a known height, so the content below it does not jump
   when the fixed navbar resolves */
.adminuiux-header .navbar {
	min-height: 60px;
}

/* Brand logo: fixed box regardless of when the image arrives */
.adminuiux-header .navbar-brand img,
.adminuiux-auth .navbar-brand img {
	width: 36px;
	height: 36px;
	object-fit: contain;
}

/* Avatars and icon tiles are square by definition */
.avatar {
	flex: 0 0 auto;
}

/* Chart canvases hold their height before the library draws */
canvas {
	max-width: 100%;
}

/* Cards that will hold a chart keep their shape while it loads */
.cp-chart-holder {
	min-height: 220px;
}

/* ---- Rendering work (INP) -----------------------------------------

   content-visibility was here and has been removed.

   It skips laying out anything off screen and substitutes the size
   given in contain-intrinsic-size. When the real content is taller —
   which it was for cards carrying a title, an amount, a description
   and a requirement list — the page is left with a tall empty gap and
   the content clipped where the guessed box ended. That is exactly the
   cut-off heading and blank space on the events page.

   A guess about height is not worth a visibly broken page, and the
   saving was small next to the bundle this template already loads.
   ------------------------------------------------------------------ */

/* ---- Paint work ---------------------------------------------------
   Backdrop filters are expensive on a phone and repaint on scroll.
   The look is kept on desktop and dropped where it hurts.
   ------------------------------------------------------------------ */

@media (max-width: 767.98px) {
	.adminuiux-header,
	.adminuiux-mobile-footer,
	.blur,
	.bg-white-blur,
	.bg-dark-blur {
		backdrop-filter: none;
		-webkit-backdrop-filter: none;
	}
}

/* Respect a reader who has asked for less motion, and save the work */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
}

/* The dollar figure beside each plan amount. Quiet on purpose — it is a
   convenience for members funding from crypto, not a second headline. */
.cp-plan-meta-usdt {
	display: block;
	margin-top: 2px;
	font-size: .72rem;
	line-height: 1.2;
	color: var(--adminuiux-text-secondary, #6f6a8c);
	white-space: nowrap;
}

/* ==================================================================
   20. Text that was getting cut off

   A flex or grid child defaults to min-width:auto, so it will not
   shrink below its content and instead pushes a neighbour outside the
   box. Where the parent clips, that neighbour disappears entirely —
   which is why text vanished on some cards rather than wrapping.
   ================================================================== */

.cp-plan-meta,
.cp-plan-meta > div,
.cp-announcement .d-flex,
.cp-announcement .d-flex > div,
.adminuiux-card .d-flex,
.adminuiux-card .d-flex > * {
	min-width: 0;
}

/* Long values — wallet addresses, IBANs, memos, emails, plan names —
   break rather than run past the edge */
.cp-plan-title,
.cp-plan-meta-value,
.cp-announcement h6,
.cp-copy-value,
.cp-address,
.card-body p,
.card-body h5,
.card-body h6 {
	overflow-wrap: anywhere;
}

/* The dollar line may wrap on a narrow card instead of widening it */
@media (max-width: 400px) {
	.cp-plan-meta-usdt { white-space: normal; }
}

/* A plan card's buttons shrink instead of forcing the card wider */
.cp-plan-card .d-grid .btn {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Tables in the member area scroll inside their own box */
.adminuiux-card .table-responsive,
.cp-table-wrap {
	max-width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

/* Stat strips: four across on desktop, two on a phone, never clipped */
@media (max-width: 575.98px) {
	.cp-plan-meta {
		flex-wrap: wrap;
		gap: .5rem 0;
	}

	.cp-plan-meta > div { flex: 1 0 33%; }
}

/* ==================================================================
   21. Palette fallback

   Every coloured surface in the member area — bg-theme-1 panels,
   theme-tinted tiles, icon chips — takes its colour from a CSS
   variable written by an inline <style> block. Where that block is
   missing, cached empty, or applied after the paint, the variables
   resolve to nothing: the panel renders white, and the white text
   written for it disappears with it.

   That is the fault that emptied the company pages. The fix went into
   the content plugin's stylesheet, which the member area never loads,
   so these screens were still exposed to it.

   These sit on :root. The real palette is written as
   ":root body.theme-capital", which is more specific and still wins.
   This only answers when nothing else has — exactly when a screen
   would otherwise go blank.
   ================================================================== */

:root {
	--adminuiux-theme-1: #3a1fd6;
	--adminuiux-theme-1-rgb: 58, 31, 214;
	--adminuiux-theme-1-text: #ffffff;
	--adminuiux-theme-1-hover: #3319bd;
	--adminuiux-theme-1-active: #2b14a3;
	--adminuiux-theme-1-subtle: #eeebfd;
	--adminuiux-theme-2: #7d2ae8;
	--adminuiux-theme-2-rgb: 125, 42, 232;
	--adminuiux-theme-2-text: #ffffff;
	--adminuiux-theme-accent-1: #0050f0;
	--adminuiux-theme-accent-2: #b23ce0;
	--adminuiux-bg-1: #0a0620;
	--adminuiux-bg-2: #140c33;
	--adminuiux-border: #e3e0f5;
	--adminuiux-text: #141034;
}

/* A panel that declares itself coloured must never paint white,
   because the text placed on it is white by design. */
.bg-theme-1 {
	background-color: var(--adminuiux-theme-1, #3a1fd6) !important;
	color: var(--adminuiux-theme-1-text, #fff);
}

.bg-theme-1 h1, .bg-theme-1 h2, .bg-theme-1 h3,
.bg-theme-1 h4, .bg-theme-1 h5, .bg-theme-1 h6,
.bg-theme-1 p, .bg-theme-1 a, .bg-theme-1 .text-white {
	color: #fff;
}

.bg-theme-1-subtle {
	background-color: var(--adminuiux-theme-1-subtle, #eeebfd) !important;
}

/* Tinted panels carry dark text, so they must not inherit the white */
.bg-theme-1-subtle,
.bg-theme-1-subtle p,
.bg-theme-1-subtle h4,
.bg-theme-1-subtle h5,
.bg-theme-1-subtle h6 {
	color: var(--adminuiux-text, #141034);
}

.text-theme-1 { color: var(--adminuiux-theme-1, #3a1fd6) !important; }

/* Dark mode: the tint is a dark panel, so its text goes light */
[data-bs-theme="dark"] .bg-theme-1-subtle,
[data-bs-theme="dark"] .bg-theme-1-subtle p,
[data-bs-theme="dark"] .bg-theme-1-subtle h4,
[data-bs-theme="dark"] .bg-theme-1-subtle h5,
[data-bs-theme="dark"] .bg-theme-1-subtle h6 {
	color: #ece9ff;
}

[data-bs-theme="dark"] .text-theme-1 { color: #8c7aff !important; }

/* An image dropped into a cover box stays inside it. Without a rule
   the raw <img> renders at its natural size and stretches its block
   far taller than the content needs. */
.coverimg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* The icon beside a page heading. Same glyph the sidebar uses for that
   route, so the two can never disagree. */
.cp-page-icon {
	margin-right: .5rem;
	color: var(--adminuiux-theme-1, #3a1fd6);
	vertical-align: -.05em;
}

/* ==================================================================
   22. Tables on a narrow screen

   Two faults, together, produced the mangled transactions list.

   overflow-wrap:anywhere was added to stop long unbroken strings —
   wallet addresses, IBANs — from overflowing their card. It reached
   table cells too, where it does the opposite of helping: "Profit"
   breaks into "Pr / of / it" and a date into "22- / 09- / 2026",
   because the rule allows a break at any character.

   And the table was not actually scrolling. It carried a min-width
   but its wrapper had no overflow-x, so instead of sliding sideways
   the cells were crushed until the text had nowhere to go.
   ================================================================== */

/* The wrapper scrolls. Without this the min-width below does nothing
   but squeeze. */
.table-responsive,
.adminuiux-card .table-responsive {
	display: block;
	width: 100%;
	max-width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

/* Cells wrap at spaces, like prose — never mid-word. The anywhere rule
   is for the few things that genuinely have no break opportunity, and
   those get it back explicitly below. */
.table th,
.table td,
.table th *,
.table td * {
	overflow-wrap: normal;
	word-break: normal;
	hyphens: none;
}

/* Things that must stay on one line rather than stack a character at a
   time: dates, times, money, reference numbers, status chips. */
.table td .cp-nowrap,
.table td .badge,
.table th:first-child,
.table td:first-child,
.table td.cp-amount,
.table td.cp-date {
	white-space: nowrap;
}

/* The exception: a wallet address or IBAN in a cell has no spaces to
   wrap at, so it may break anywhere rather than push the table wider
   than the screen can scroll. */
.table td .cp-address,
.table td code {
	overflow-wrap: anywhere;
	word-break: break-all;
}

@media (max-width: 767.98px) {
	/* Wide enough that every column has room for its content, and the
	   wrapper carries the sideways scroll. */
	.adminuiux-card .table {
		min-width: 560px;
	}

	.adminuiux-card .table th,
	.adminuiux-card .table td {
		padding: .6rem .55rem;
		font-size: .85rem;
		vertical-align: middle;
	}

	/* A note column can wrap; it is the one thing with real sentences */
	.adminuiux-card .table td.cp-note {
		white-space: normal;
		min-width: 150px;
	}

	/* The scroll needs to be discoverable, so the edge is shaded */
	.table-responsive {
		background:
			linear-gradient(to right, var(--adminuiux-card-bg, #fff) 30%, rgba(255,255,255,0)),
			linear-gradient(to right, rgba(0,0,0,.08), rgba(0,0,0,0) 12px) 100% 0;
		background-repeat: no-repeat;
		background-size: 40px 100%, 14px 100%;
		background-attachment: local, scroll;
	}
}