/* =========================================================================
   Cloud — Modern Overlay (v2)
   Loaded after Falbium.css. Adds modern violet polish (forms, buttons,
   scrollbar) and powers the new UX modules (server pulse, fly-to-cart,
   password meter, 3D tilt, wishlist heart, bundle progress).
   Intentionally narrow: avoids blanket .card / .section / .hero rules so
   the heavily customised home page (.demo-* layout) is not disturbed.
   ========================================================================= */

:root {
	--cm-violet-50:  #F5F3FF;
	--cm-violet-100: #EDE9FE;
	--cm-violet-200: #DDD6FE;
	--cm-violet-300: #C4B5FD;
	--cm-violet-400: #A78BFA;
	--cm-violet-500: #8B5CF6;
	--cm-violet-600: #7C3AED;
	--cm-violet-700: #6D28D9;
	--cm-violet-800: #5B21B6;

	--cm-text:        #F4F2FB;
	--cm-text-muted:  #B8B0D6;
	--cm-text-subtle: #8077A8;

	--cm-radius-sm: 10px;
	--cm-radius-md: 14px;
	--cm-radius-lg: 20px;

	--cm-shadow-md:    0 8px 24px rgba(7, 4, 26, 0.45), 0 2px 6px rgba(7, 4, 26, 0.3);
	--cm-shadow-lg:    0 24px 56px rgba(7, 4, 26, 0.55), 0 6px 16px rgba(7, 4, 26, 0.35);
	--cm-shadow-glow:  0 12px 40px rgba(139, 92, 246, 0.35), 0 4px 12px rgba(139, 92, 246, 0.25);
	--cm-shadow-inset: inset 0 1px 0 rgba(255, 255, 255, 0.06);

	--cm-ease:     cubic-bezier(0.22, 1, 0.36, 1);
	--cm-ease-out: cubic-bezier(0.16, 1, 0.3, 1);

	--cm-grad-primary: linear-gradient(135deg, #8B5CF6 0%, #7C3AED 50%, #6D28D9 100%);
}

/* -------------------------------------------------------------------------
   1. Scrollbar polish — universal but harmless
   ------------------------------------------------------------------------- */

body.falbium-theme-shell::-webkit-scrollbar { width: 10px; height: 10px; }
body.falbium-theme-shell::-webkit-scrollbar-track { background: transparent; }
body.falbium-theme-shell::-webkit-scrollbar-thumb {
	background: linear-gradient(180deg, rgba(139, 92, 246, 0.55), rgba(109, 40, 217, 0.55));
	border-radius: 999px;
	border: 2px solid transparent;
	background-clip: padding-box;
}
body.falbium-theme-shell::-webkit-scrollbar-thumb:hover {
	background: linear-gradient(180deg, rgba(167, 139, 250, 0.7), rgba(124, 58, 237, 0.7));
	background-clip: padding-box;
}

body.falbium-theme-shell ::selection {
	background: rgba(139, 92, 246, 0.4);
	color: #fff;
}

/* -------------------------------------------------------------------------
   2. Buttons — modernise primary/success only on simple components
   (login, dashboard, cart actions). Skip the homepage hero buttons,
   which Falbium already styles via .header-hero-action.
   ------------------------------------------------------------------------- */

body.falbium-theme-shell .card .btn-primary,
body.falbium-theme-shell .card .btn-success,
body.falbium-theme-shell form:not(.demo-search-form) .btn-primary,
body.falbium-theme-shell form:not(.demo-search-form) .btn-success {
	background: var(--cm-grad-primary);
	color: #fff;
	border-color: rgba(167, 139, 250, 0.4);
	box-shadow: var(--cm-shadow-glow);
	transition:
		transform 0.2s var(--cm-ease-out),
		box-shadow 0.25s var(--cm-ease-out);
}

body.falbium-theme-shell .card .btn-primary:hover,
body.falbium-theme-shell .card .btn-success:hover,
body.falbium-theme-shell form:not(.demo-search-form) .btn-primary:hover,
body.falbium-theme-shell form:not(.demo-search-form) .btn-success:hover {
	transform: translateY(-1px);
	box-shadow: 0 18px 48px rgba(139, 92, 246, 0.45), 0 6px 16px rgba(139, 92, 246, 0.3);
}

body.falbium-theme-shell .card .btn-danger,
body.falbium-theme-shell form .btn-danger {
	background: linear-gradient(135deg, #F87171 0%, #DC2626 100%);
	color: #fff;
	border-color: rgba(248, 113, 113, 0.4);
}

/* -------------------------------------------------------------------------
   3. Form controls — only inside cards/forms (avoids touching home page
   widgets that style their own inputs). Adds violet focus ring.
   ------------------------------------------------------------------------- */

body.falbium-theme-shell .card .form-control,
body.falbium-theme-shell .card .form-select,
body.falbium-theme-shell .card input[type="text"]:not([disabled]),
body.falbium-theme-shell .card input[type="email"]:not([disabled]),
body.falbium-theme-shell .card input[type="password"]:not([disabled]),
body.falbium-theme-shell .card input[type="number"]:not([disabled]),
body.falbium-theme-shell .card textarea:not([disabled]),
body.falbium-theme-shell .card select:not([disabled]) {
	background: rgba(20, 14, 42, 0.65);
	border: 1px solid rgba(255, 255, 255, 0.09);
	border-radius: var(--cm-radius-md);
	color: var(--cm-text);
	transition:
		border-color 0.2s var(--cm-ease),
		box-shadow 0.2s var(--cm-ease),
		background 0.2s var(--cm-ease);
}

body.falbium-theme-shell .card .form-control:focus,
body.falbium-theme-shell .card .form-select:focus,
body.falbium-theme-shell .card input:focus,
body.falbium-theme-shell .card textarea:focus,
body.falbium-theme-shell .card select:focus {
	border-color: rgba(139, 92, 246, 0.7);
	box-shadow: 0 0 0 4px rgba(139, 92, 246, 0.18);
	background: rgba(20, 14, 42, 0.85);
	outline: none;
}

/* -------------------------------------------------------------------------
   4. Badges (soft pills) — used across cart, account pages, dashboard
   ------------------------------------------------------------------------- */

body.falbium-theme-shell .badge {
	border-radius: 999px;
	padding: 0.28rem 0.7rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	font-size: 0.72rem;
}

body.falbium-theme-shell .badge-soft-primary,
body.falbium-theme-shell .badge.bg-primary {
	background: rgba(139, 92, 246, 0.18) !important;
	color: var(--cm-violet-200) !important;
	border: 1px solid rgba(139, 92, 246, 0.35);
}

body.falbium-theme-shell .badge-soft-success,
body.falbium-theme-shell .badge.bg-success {
	background: rgba(74, 222, 128, 0.14) !important;
	color: #86EFAC !important;
	border: 1px solid rgba(74, 222, 128, 0.3);
}

body.falbium-theme-shell .badge-soft-danger,
body.falbium-theme-shell .badge.bg-danger {
	background: rgba(248, 113, 113, 0.14) !important;
	color: #FCA5A5 !important;
	border: 1px solid rgba(248, 113, 113, 0.3);
}

/* -------------------------------------------------------------------------
   5. Modals & dropdowns — used everywhere, safe to polish
   ------------------------------------------------------------------------- */

body.falbium-theme-shell .modal-content,
body.falbium-theme-shell .dropdown-menu {
	background: rgba(13, 8, 32, 0.92);
	backdrop-filter: blur(24px) saturate(160%);
	-webkit-backdrop-filter: blur(24px) saturate(160%);
	border: 1px solid rgba(139, 92, 246, 0.22);
	border-radius: var(--cm-radius-lg);
	box-shadow: var(--cm-shadow-lg);
	color: var(--cm-text);
}

body.falbium-theme-shell .dropdown-item {
	color: var(--cm-text-muted);
	padding: 0.55rem 0.95rem;
	border-radius: var(--cm-radius-sm);
	margin: 0.1rem 0.35rem;
	transition: background 0.18s var(--cm-ease), color 0.18s var(--cm-ease);
}

body.falbium-theme-shell .dropdown-item:hover {
	background: rgba(139, 92, 246, 0.16);
	color: #fff;
}

/* Focus visibility for keyboard users */
body.falbium-theme-shell *:focus-visible {
	outline: 2px solid rgba(167, 139, 250, 0.7);
	outline-offset: 3px;
	border-radius: 4px;
}

/* Reduced motion respect (covers our custom animations) */
@media (prefers-reduced-motion: reduce) {
	.cm-fly-clone,
	.cm-cart-bump,
	.cm-tilt,
	.cm-wishlist-heart,
	body.falbium-theme-shell .demo-brand-status-dot.is-pulsing::after {
		animation: none !important;
		transition: none !important;
	}
}

/* =========================================================================
   FEATURE MODULES — these are new behaviours added on top of Cloud, not
   re-skins of existing elements. They are scoped to classes/elements that
   only this overlay produces, so they cannot break the home page.
   ========================================================================= */

/* -------------------------------------------------------------------------
   M1. Server status pulse + count-up
   ------------------------------------------------------------------------- */

body.falbium-theme-shell .demo-navbar-server-meta.is-online {
	border-color: rgba(74, 222, 128, 0.32);
}
body.falbium-theme-shell .demo-navbar-server-meta.is-offline {
	border-color: rgba(248, 113, 113, 0.32);
}

body.falbium-theme-shell .demo-navbar-server-meta.is-online .demo-brand-status-dot {
	background: #4ADE80;
	box-shadow: 0 0 12px rgba(74, 222, 128, 0.7);
	position: relative;
}
body.falbium-theme-shell .demo-navbar-server-meta.is-offline .demo-brand-status-dot {
	background: #F87171;
	box-shadow: 0 0 8px rgba(248, 113, 113, 0.5);
}

body.falbium-theme-shell .demo-brand-status-dot.is-pulsing::after {
	content: "";
	position: absolute;
	inset: -4px;
	border-radius: 999px;
	border: 2px solid rgba(74, 222, 128, 0.55);
	animation: cm-status-pulse 1.8s var(--cm-ease) infinite;
}

@keyframes cm-status-pulse {
	0%   { transform: scale(0.8); opacity: 0.9; }
	70%  { transform: scale(1.9); opacity: 0; }
	100% { transform: scale(1.9); opacity: 0; }
}

body.falbium-theme-shell .demo-navbar-server-meta.is-online .demo-navbar-server-online-value {
	color: #86EFAC;
}
body.falbium-theme-shell .demo-navbar-server-meta.is-offline .demo-navbar-server-online-value {
	color: #FCA5A5;
}

/* -------------------------------------------------------------------------
   M2. Add-to-cart fly clone
   ------------------------------------------------------------------------- */

.cm-fly-clone {
	position: fixed !important;
	z-index: 9999;
	pointer-events: none;
	border-radius: var(--cm-radius-md);
	object-fit: cover;
	box-shadow: 0 12px 36px rgba(139, 92, 246, 0.45), 0 0 0 2px rgba(167, 139, 250, 0.5);
	transition:
		transform 0.75s cubic-bezier(0.34, 0.84, 0.42, 1),
		opacity 0.75s ease-out;
	will-change: transform, opacity;
}

.cm-cart-bump {
	animation: cm-cart-bump 0.4s var(--cm-ease);
}

@keyframes cm-cart-bump {
	0%   { transform: scale(1); }
	30%  { transform: scale(1.28); }
	60%  { transform: scale(0.92); }
	100% { transform: scale(1); }
}

/* -------------------------------------------------------------------------
   M3. Password show/hide toggle + strength meter
   ------------------------------------------------------------------------- */

body.falbium-theme-shell .cm-pw-toggle {
	position: absolute;
	right: 14px;
	top: 50%;
	transform: translateY(-50%);
	width: 34px;
	height: 34px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border: 0;
	color: var(--cm-text-subtle);
	border-radius: 999px;
	cursor: pointer;
	transition: color 0.18s var(--cm-ease), background 0.18s var(--cm-ease);
	z-index: 2;
}

body.falbium-theme-shell .cm-pw-toggle:hover,
body.falbium-theme-shell .cm-pw-toggle:focus-visible {
	color: var(--cm-violet-200);
	background: rgba(139, 92, 246, 0.14);
}

body.falbium-theme-shell .cm-pw-toggle.is-shown {
	color: var(--cm-violet-300);
}

body.falbium-theme-shell .cm-pw-meter {
	margin-top: 0.5rem;
	display: grid;
	gap: 0.35rem;
}

body.falbium-theme-shell .cm-pw-meter-bar {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 4px;
}

body.falbium-theme-shell .cm-pw-meter-bar > span {
	height: 4px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.07);
	transition: background 0.25s var(--cm-ease);
}

body.falbium-theme-shell .cm-pw-meter-bar[data-score="1"] > span:nth-child(-n+1),
body.falbium-theme-shell .cm-pw-meter-bar[data-score="2"] > span:nth-child(-n+2) {
	background: #F87171;
}

body.falbium-theme-shell .cm-pw-meter-bar[data-score="3"] > span:nth-child(-n+3) {
	background: #FACC15;
}

body.falbium-theme-shell .cm-pw-meter-bar[data-score="4"] > span:nth-child(-n+4) {
	background: #A78BFA;
}

body.falbium-theme-shell .cm-pw-meter-bar[data-score="5"] > span {
	background: #4ADE80;
}

body.falbium-theme-shell .cm-pw-meter-label {
	font-size: 0.74rem;
	color: var(--cm-text-subtle);
	letter-spacing: 0.02em;
	min-height: 1.1em;
	text-align: center;
}

/* -------------------------------------------------------------------------
   M4. 3D tilt — applied only to .store-card via JS (cm-tilt class)
   ------------------------------------------------------------------------- */

body.falbium-theme-shell .cm-tilt {
	transition:
		transform 0.25s var(--cm-ease),
		box-shadow 0.25s var(--cm-ease);
	transform-style: preserve-3d;
	will-change: transform;
}

body.falbium-theme-shell .cm-tilt.is-tilting {
	transition:
		transform 0.05s linear,
		box-shadow 0.25s var(--cm-ease);
	box-shadow: 0 32px 70px rgba(7, 4, 26, 0.55), 0 0 0 1px rgba(167, 139, 250, 0.3);
}

body.falbium-theme-shell .cm-tilt.is-tilting::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	pointer-events: none;
	background: radial-gradient(
		circle at var(--cm-tilt-x, 50%) var(--cm-tilt-y, 50%),
		rgba(167, 139, 250, 0.18) 0%,
		transparent 45%
	);
	z-index: 1;
}

body.falbium-theme-shell .store-card.cm-tilt {
	position: relative;
	overflow: hidden;
}

body.falbium-theme-shell .store-card.cm-tilt > * {
	position: relative;
	z-index: 2;
}

/* -------------------------------------------------------------------------
   M5. Wishlist heart button
   ------------------------------------------------------------------------- */

.cm-wishlist-heart {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 5;
	width: 38px;
	height: 38px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 999px;
	background: rgba(13, 8, 32, 0.78);
	border: 1px solid rgba(255, 255, 255, 0.08);
	color: rgba(255, 255, 255, 0.6);
	backdrop-filter: blur(12px);
	cursor: pointer;
	transition:
		color 0.2s var(--cm-ease),
		background 0.2s var(--cm-ease),
		border-color 0.2s var(--cm-ease),
		transform 0.2s var(--cm-ease);
}

.cm-wishlist-heart:hover {
	color: #FCA5A5;
	border-color: rgba(248, 113, 113, 0.4);
	transform: scale(1.08);
}

.cm-wishlist-heart.is-active {
	color: #fff;
	background: linear-gradient(135deg, #F87171 0%, #DC2626 100%);
	border-color: rgba(248, 113, 113, 0.6);
	box-shadow: 0 6px 18px rgba(248, 113, 113, 0.4);
}

.cm-wishlist-heart.is-active svg {
	fill: currentColor;
}

.cm-wishlist-heart.is-pulsing {
	animation: cm-heart-pulse 0.45s var(--cm-ease);
}

@keyframes cm-heart-pulse {
	0%   { transform: scale(1); }
	30%  { transform: scale(1.35); }
	60%  { transform: scale(0.92); }
	100% { transform: scale(1); }
}

/* Inline placement variant (next to product title on detail page) */
.cm-wishlist-heart-inline {
	position: static;
	width: 44px;
	height: 44px;
	margin-left: 0.5rem;
	vertical-align: middle;
}

/* -------------------------------------------------------------------------
   M6. Bundle discount progress (cart upsell)
   ------------------------------------------------------------------------- */

body.falbium-theme-shell .cm-bundle-progress {
	margin: 0.75rem 0 1.25rem;
	padding: 1rem 1.15rem;
	border-radius: var(--cm-radius-lg);
	background: linear-gradient(135deg, rgba(139, 92, 246, 0.12) 0%, rgba(124, 58, 237, 0.06) 100%);
	border: 1px solid rgba(139, 92, 246, 0.28);
	position: relative;
	overflow: hidden;
}

body.falbium-theme-shell .cm-bundle-progress.is-unlocked {
	background: linear-gradient(135deg, rgba(74, 222, 128, 0.15) 0%, rgba(34, 197, 94, 0.08) 100%);
	border-color: rgba(74, 222, 128, 0.35);
}

body.falbium-theme-shell .cm-bundle-progress-text {
	font-size: 0.88rem;
	color: var(--cm-text);
	margin-bottom: 0.6rem;
	font-weight: 500;
}

body.falbium-theme-shell .cm-bundle-progress-text strong {
	color: var(--cm-violet-300);
	font-weight: 700;
}

body.falbium-theme-shell .cm-bundle-progress.is-unlocked .cm-bundle-progress-text strong {
	color: #86EFAC;
}

body.falbium-theme-shell .cm-bundle-progress-bar {
	height: 6px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.08);
	overflow: hidden;
	position: relative;
}

body.falbium-theme-shell .cm-bundle-progress-fill {
	height: 100%;
	background: linear-gradient(90deg, var(--cm-violet-500), var(--cm-violet-400));
	border-radius: 999px;
	transition: width 0.6s var(--cm-ease-out);
	box-shadow: 0 0 12px rgba(139, 92, 246, 0.5);
}

body.falbium-theme-shell .cm-bundle-progress.is-unlocked .cm-bundle-progress-fill {
	background: linear-gradient(90deg, #4ADE80, #22C55E);
	box-shadow: 0 0 12px rgba(74, 222, 128, 0.5);
}

body.falbium-theme-shell .cm-bundle-tier-list {
	display: flex;
	gap: 0.4rem;
	margin-top: 0.55rem;
	font-size: 0.72rem;
	color: var(--cm-text-subtle);
	flex-wrap: wrap;
}

body.falbium-theme-shell .cm-bundle-tier-pill {
	padding: 0.2rem 0.55rem;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid rgba(255, 255, 255, 0.06);
}

body.falbium-theme-shell .cm-bundle-tier-pill.is-current {
	background: rgba(139, 92, 246, 0.2);
	border-color: rgba(139, 92, 246, 0.5);
	color: var(--cm-violet-100);
	font-weight: 600;
}

/* -------------------------------------------------------------------------
   M7. Empty wishlist state
   ------------------------------------------------------------------------- */

body.falbium-theme-shell .cm-empty-state {
	padding: 3rem 1rem;
	text-align: center;
	color: var(--cm-text-muted);
}

body.falbium-theme-shell .cm-empty-state-icon {
	width: 72px;
	height: 72px;
	margin: 0 auto 1rem;
	border-radius: 999px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(139, 92, 246, 0.12);
	color: var(--cm-violet-300);
}

body.falbium-theme-shell .cm-empty-state-title {
	color: var(--cm-text);
	font-weight: 600;
	margin-bottom: 0.4rem;
}

/* -------------------------------------------------------------------------
   M8. Checkout fee breakdown — shown in cart when chosen gateway has a fee
   ------------------------------------------------------------------------- */

body.falbium-theme-shell .cm-checkout-fee-box {
	margin-top: 0.75rem;
	margin-bottom: 0.75rem;
	padding: 1rem 1.15rem;
	border-radius: var(--cm-radius-lg);
	background: linear-gradient(135deg, rgba(139, 92, 246, 0.10) 0%, rgba(124, 58, 237, 0.05) 100%);
	border: 1px solid rgba(139, 92, 246, 0.28);
}

body.falbium-theme-shell .cm-checkout-fee-divider {
	margin: 0.55rem 0;
	border: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(167, 139, 250, 0.35), transparent);
	opacity: 1;
}

body.falbium-theme-shell .cm-checkout-fee-label {
	font-weight: 600;
	color: var(--cm-text);
	font-size: 0.95rem;
}

body.falbium-theme-shell .cm-checkout-fee-payable {
	font-weight: 800;
	font-size: 1.25rem;
	color: #86EFAC;
	letter-spacing: -0.01em;
}

/* -------------------------------------------------------------------------
   M11. Cart promotions list (bundle / quantity-tier savings)
   ------------------------------------------------------------------------- */

body.falbium-theme-shell .cm-promo-list {
	margin: 0.85rem 0 1rem;
	padding: 1rem 1.15rem;
	border-radius: var(--cm-radius-lg);
	background: linear-gradient(135deg, rgba(74, 222, 128, 0.10) 0%, rgba(34, 197, 94, 0.04) 100%);
	border: 1px solid rgba(74, 222, 128, 0.32);
}

body.falbium-theme-shell .cm-promo-list-title {
	font-weight: 700;
	color: #86EFAC;
	margin-bottom: 0.6rem;
	font-size: 0.88rem;
}

body.falbium-theme-shell .cm-promo-item {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0.5rem 0;
	border-top: 1px dashed rgba(74, 222, 128, 0.22);
	font-size: 0.88rem;
}

body.falbium-theme-shell .cm-promo-item:first-of-type {
	border-top: 0;
}

body.falbium-theme-shell .cm-promo-count {
	margin-left: 0.5rem;
	padding: 0.15rem 0.5rem;
	background: rgba(74, 222, 128, 0.18);
	color: #86EFAC;
	border-radius: 999px;
	font-size: 0.72rem;
	font-weight: 700;
}

body.falbium-theme-shell .cm-promo-saving {
	color: #86EFAC;
	font-weight: 700;
	font-size: 0.95rem;
}

body.falbium-theme-shell .cm-promo-strike {
	color: var(--cm-text-subtle);
	font-size: 0.72rem;
	text-decoration: line-through;
	margin-top: 0.1rem;
}

body.falbium-theme-shell .cm-promo-suggest {
	margin: 0.85rem 0 0.5rem;
	padding: 0.85rem 1rem;
	border-radius: var(--cm-radius-lg);
	background: linear-gradient(135deg, rgba(252, 211, 77, 0.10) 0%, rgba(245, 158, 11, 0.04) 100%);
	border: 1px dashed rgba(252, 211, 77, 0.45);
}

body.falbium-theme-shell .cm-promo-suggest-title {
	font-weight: 700;
	color: #FCD34D;
	font-size: 0.88rem;
	margin-bottom: 0.5rem;
}

body.falbium-theme-shell .cm-promo-suggest-item {
	padding: 0.45rem 0;
	border-top: 1px dashed rgba(252, 211, 77, 0.22);
}
body.falbium-theme-shell .cm-promo-suggest-item:first-of-type {
	border-top: 0;
}

body.falbium-theme-shell .cm-promo-suggest-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 0.88rem;
}

body.falbium-theme-shell .cm-promo-suggest-saving {
	color: #FCD34D;
	font-weight: 700;
	font-size: 0.78rem;
}

body.falbium-theme-shell .cm-promo-suggest-missing {
	font-size: 0.78rem;
	color: var(--cm-text-muted);
	padding: 2px 0 0 14px;
}

/* -------------------------------------------------------------------------
   M12. Toast notifications (top-right slide-in)
   ------------------------------------------------------------------------- */

.cm-toast-stack {
	position: fixed;
	top: 24px;
	right: 24px;
	z-index: 99999;
	display: flex;
	flex-direction: column;
	gap: 10px;
	pointer-events: none;
	max-width: calc(100vw - 48px);
}

.cm-toast {
	pointer-events: auto;
	min-width: 280px;
	max-width: 420px;
	padding: 12px 16px;
	border-radius: 14px;
	background: rgba(13, 8, 32, 0.96);
	border: 1px solid rgba(167, 139, 250, 0.28);
	box-shadow: 0 16px 48px rgba(7, 4, 26, 0.55);
	color: #F4F2FB;
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 0.92rem;
	line-height: 1.4;
	font-family: "Manrope", "Inter", system-ui, sans-serif;
	transform: translateX(20px);
	opacity: 0;
	transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.25s ease;
	backdrop-filter: blur(18px);
}

.cm-toast.is-shown {
	transform: translateX(0);
	opacity: 1;
}

.cm-toast.is-leaving {
	transform: translateX(20px);
	opacity: 0;
}

.cm-toast-icon {
	flex-shrink: 0;
	width: 28px;
	height: 28px;
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 800;
	font-size: 0.9rem;
	color: #fff;
}

.cm-toast-success .cm-toast-icon { background: linear-gradient(135deg, #4ADE80, #22C55E); }
.cm-toast-error   .cm-toast-icon { background: linear-gradient(135deg, #F87171, #DC2626); }
.cm-toast-warning .cm-toast-icon { background: linear-gradient(135deg, #FACC15, #EAB308); color: #1F1900; }
.cm-toast-info    .cm-toast-icon { background: linear-gradient(135deg, #8B5CF6, #6D28D9); }

.cm-toast-success { border-color: rgba(74, 222, 128, 0.4); }
.cm-toast-error   { border-color: rgba(248, 113, 113, 0.45); }
.cm-toast-warning { border-color: rgba(252, 211, 77, 0.45); }

.cm-toast-message { flex: 1; }

.cm-toast-close {
	background: transparent;
	border: 0;
	color: rgba(255, 255, 255, 0.55);
	font-size: 1.4rem;
	line-height: 1;
	cursor: pointer;
	padding: 0 4px;
	transition: color 0.2s ease;
}
.cm-toast-close:hover { color: #fff; }

@media (max-width: 600px) {
	.cm-toast-stack {
		top: 12px;
		right: 12px;
		left: 12px;
		max-width: none;
	}
	.cm-toast { min-width: 0; }
}

/* -------------------------------------------------------------------------
   M13. Mini cart drawer (right slide-in)
   ------------------------------------------------------------------------- */

.cm-drawer-backdrop {
	position: fixed;
	inset: 0;
	background: rgba(7, 4, 26, 0.7);
	backdrop-filter: blur(6px);
	z-index: 9990;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.25s ease, visibility 0.25s ease;
}
.cm-drawer-backdrop.is-open { opacity: 1; visibility: visible; }

.cm-cart-drawer {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	max-width: 420px;
	background: linear-gradient(180deg, #13091F 0%, #0A0517 100%);
	border-left: 1px solid rgba(139, 92, 246, 0.28);
	box-shadow: -24px 0 60px rgba(7, 4, 26, 0.6);
	z-index: 9991;
	display: flex;
	flex-direction: column;
	transform: translateX(110%);
	transition: transform 0.32s cubic-bezier(0.16, 1, 0.3, 1);
	color: #F4F2FB;
	font-family: "Manrope", "Inter", system-ui, sans-serif;
}
.cm-cart-drawer.is-open { transform: translateX(0); }

.cm-cart-drawer-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1rem 1.25rem;
	border-bottom: 1px solid rgba(139, 92, 246, 0.18);
}
.cm-cart-drawer-header h3 { margin: 0; font-size: 1.1rem; font-weight: 700; }
.cm-cart-drawer-close {
	background: rgba(139, 92, 246, 0.14);
	border: 1px solid rgba(139, 92, 246, 0.28);
	color: #fff;
	width: 32px; height: 32px;
	border-radius: 999px;
	font-size: 1.25rem;
	line-height: 1;
	cursor: pointer;
	transition: background 0.18s ease;
}
.cm-cart-drawer-close:hover { background: rgba(139, 92, 246, 0.28); }

.cm-cart-drawer-body {
	flex: 1;
	overflow-y: auto;
	padding: 0.5rem 0;
}

.cm-cart-drawer-loading,
.cm-cart-drawer-empty {
	padding: 3rem 1.5rem;
	text-align: center;
	color: rgba(255,255,255,0.6);
}
.cm-cart-drawer-empty-icon { font-size: 3rem; margin-bottom: 0.5rem; }

.cm-cart-drawer-items {
	list-style: none;
	margin: 0;
	padding: 0;
}
.cm-cart-drawer-item {
	display: flex;
	gap: 12px;
	padding: 14px 1.25rem;
	border-bottom: 1px solid rgba(255,255,255,0.04);
}
.cm-cart-drawer-item img {
	width: 56px; height: 56px;
	border-radius: 10px;
	object-fit: cover;
	background: rgba(255,255,255,0.04);
	flex-shrink: 0;
}
.cm-cart-drawer-item-meta { flex: 1; min-width: 0; }
.cm-cart-drawer-item-name {
	font-weight: 600;
	margin-bottom: 4px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.cm-cart-drawer-item-meta-row {
	display: flex;
	justify-content: space-between;
	font-size: 0.88rem;
}

.cm-cart-drawer-promos {
	margin: 0.5rem 1.25rem;
	padding: 0.75rem;
	background: rgba(74, 222, 128, 0.10);
	border: 1px solid rgba(74, 222, 128, 0.32);
	border-radius: 12px;
}
.cm-cart-drawer-promo {
	display: flex;
	justify-content: space-between;
	font-size: 0.82rem;
	padding: 4px 0;
}
.cm-cart-drawer-promo-count {
	margin-left: 6px;
	background: rgba(74, 222, 128, 0.2);
	padding: 1px 6px;
	border-radius: 999px;
	font-size: 0.7rem;
}
.cm-cart-drawer-promo-saving { color: #86EFAC; font-weight: 700; }

.cm-cart-drawer-footer {
	padding: 1rem 1.25rem;
	border-top: 1px solid rgba(139, 92, 246, 0.18);
}
.cm-cart-drawer-total {
	display: flex;
	justify-content: space-between;
	margin-bottom: 0.85rem;
	font-size: 1.05rem;
}
.cm-cart-drawer-total strong {
	color: #86EFAC;
	font-size: 1.2rem;
	font-weight: 800;
}

@media (max-width: 480px) {
	.cm-cart-drawer { max-width: 100%; }
}

/* -------------------------------------------------------------------------
   M14. Exit-intent modal
   ------------------------------------------------------------------------- */

.cm-exit-modal {
	position: fixed;
	inset: 0;
	z-index: 9995;
	background: rgba(7, 4, 26, 0.78);
	backdrop-filter: blur(8px);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	opacity: 0;
	transition: opacity 0.25s ease;
}
.cm-exit-modal.is-open { opacity: 1; }
.cm-exit-modal.is-leaving { opacity: 0; }

.cm-exit-card {
	position: relative;
	background: linear-gradient(180deg, #1A0F36 0%, #0D0820 100%);
	border: 1px solid rgba(167, 139, 250, 0.4);
	border-radius: 20px;
	padding: 36px 32px;
	max-width: 460px;
	width: 100%;
	text-align: center;
	color: #F4F2FB;
	box-shadow: 0 32px 80px rgba(7, 4, 26, 0.7);
	font-family: "Manrope", "Inter", system-ui, sans-serif;
	transform: scale(0.92);
	transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.cm-exit-modal.is-open .cm-exit-card { transform: scale(1); }

.cm-exit-emoji { font-size: 3rem; margin-bottom: 0.75rem; }
.cm-exit-card h2 {
	margin: 0 0 0.5rem;
	font-size: 1.6rem;
	font-weight: 800;
	background: linear-gradient(135deg, #FFF 0%, #C4B5FD 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.cm-exit-card p {
	color: rgba(255,255,255,0.75);
	margin-bottom: 1.25rem;
	font-size: 0.95rem;
}

.cm-exit-coupon {
	font-family: "JetBrains Mono", "SF Mono", ui-monospace, monospace;
	font-size: 1.6rem;
	font-weight: 800;
	letter-spacing: 0.2em;
	padding: 14px 24px;
	background: rgba(139, 92, 246, 0.18);
	border: 2px dashed rgba(167, 139, 250, 0.55);
	border-radius: 14px;
	color: #FFF;
	margin: 0 0 1.25rem;
	display: inline-block;
}

.cm-exit-cta {
	width: 100%;
	margin-bottom: 0.75rem;
	font-weight: 700;
	font-size: 1rem;
	padding: 0.85rem;
	background: linear-gradient(135deg, #8B5CF6 0%, #6D28D9 100%);
	border: 0;
	color: #fff;
	border-radius: 12px;
	cursor: pointer;
	box-shadow: 0 12px 28px rgba(139, 92, 246, 0.45);
}

.cm-exit-skip {
	display: inline-block;
	color: rgba(255,255,255,0.5);
	font-size: 0.82rem;
	text-decoration: none;
}
.cm-exit-skip:hover { color: #fff; }

.cm-exit-close {
	position: absolute;
	top: 12px;
	right: 12px;
	width: 32px; height: 32px;
	border-radius: 999px;
	background: rgba(255,255,255,0.06);
	border: 0;
	color: #fff;
	font-size: 1.4rem;
	cursor: pointer;
	transition: background 0.18s ease;
}
.cm-exit-close:hover { background: rgba(255,255,255,0.14); }

/* -------------------------------------------------------------------------
   M15. Arcenia Pass landing
   ------------------------------------------------------------------------- */

body.falbium-theme-shell .cm-pass-hero {
	background: linear-gradient(135deg, rgba(139, 92, 246, 0.18) 0%, rgba(76, 29, 149, 0.10) 100%) !important;
	border: 1px solid rgba(167, 139, 250, 0.4);
	box-shadow: 0 24px 60px rgba(139, 92, 246, 0.18);
}

body.falbium-theme-shell .cm-pass-badge {
	display: inline-block;
	padding: 6px 14px;
	background: linear-gradient(135deg, #FFD700, #FFA500);
	color: #2A1500;
	font-weight: 800;
	font-size: 0.74rem;
	letter-spacing: 0.18em;
	border-radius: 999px;
	margin-bottom: 1rem;
}

body.falbium-theme-shell .cm-pass-active {
	background: rgba(74, 222, 128, 0.12) !important;
	border-color: rgba(74, 222, 128, 0.32) !important;
	color: #86EFAC !important;
}

body.falbium-theme-shell .cm-pass-price {
	font-size: 2.6rem;
	font-weight: 800;
	color: #C4B5FD;
	margin: 1.5rem 0;
}
body.falbium-theme-shell .cm-pass-price small {
	font-size: 1rem;
	color: var(--cm-text-muted);
	font-weight: 500;
}

body.falbium-theme-shell .cm-pass-cta {
	font-size: 1.05rem;
	padding: 0.9rem 2.5rem;
}

body.falbium-theme-shell .cm-pass-feat-icon {
	font-size: 2.5rem;
	margin-bottom: 0.5rem;
}

/* -------------------------------------------------------------------------
   M16. Kişisel Mağaza
   ------------------------------------------------------------------------- */

body.falbium-theme-shell .cm-personal-shop-hero {
	text-align: center;
	padding: 2rem 1rem;
	margin-bottom: 1rem;
	background: linear-gradient(135deg, rgba(168, 85, 247, 0.18) 0%, rgba(76, 29, 149, 0.08) 100%);
	border: 1px solid rgba(168, 85, 247, 0.32);
	border-radius: var(--cm-radius-lg);
}

body.falbium-theme-shell .cm-personal-shop-eyebrow {
	display: inline-block;
	padding: 6px 14px;
	background: linear-gradient(135deg, #A855F7, #6D28D9);
	color: #fff;
	font-weight: 800;
	font-size: 0.74rem;
	letter-spacing: 0.18em;
	border-radius: 999px;
	margin-bottom: 0.75rem;
}

body.falbium-theme-shell .cm-personal-shop-hero h1 {
	font-size: clamp(1.6rem, 4vw, 2.4rem);
	margin-bottom: 0.5rem;
	background: linear-gradient(135deg, #FFF 0%, #C4B5FD 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

body.falbium-theme-shell .cm-personal-shop-hero p {
	color: var(--cm-text-muted);
	max-width: 640px;
	margin: 0 auto 1.25rem;
}

body.falbium-theme-shell .cm-personal-shop-timer {
	display: inline-block;
	padding: 8px 20px;
	background: rgba(0, 0, 0, 0.25);
	border: 1px solid rgba(167, 139, 250, 0.3);
	border-radius: 999px;
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 0.88rem;
	color: var(--cm-violet-200);
}

body.falbium-theme-shell .cm-personal-discount-badge {
	position: absolute;
	top: 8px;
	right: 8px;
	z-index: 5;
	background: linear-gradient(135deg, #FF6347 0%, #FF4500 100%);
	color: #fff;
	font-weight: 800;
	font-size: 0.92rem;
	padding: 6px 12px;
	border-radius: 12px;
	box-shadow: 0 6px 18px rgba(255, 99, 71, 0.5);
	letter-spacing: 0.04em;
}

body.falbium-theme-shell .cm-personal-card {
	transition: transform 0.25s var(--cm-ease), box-shadow 0.25s var(--cm-ease);
}
body.falbium-theme-shell .cm-personal-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 18px 44px rgba(168, 85, 247, 0.32);
}

body.falbium-theme-shell .cm-personal-shop-foot {
	text-align: center;
	color: var(--cm-text-subtle);
	font-size: 0.82rem;
}

/* -------------------------------------------------------------------------
   M16b. Kişisel Mağaza — Kilit / Reveal kartları (3D flip)
   ------------------------------------------------------------------------- */

body.falbium-theme-shell .cm-mystery-card {
	perspective: 1200px;
	height: 380px;
}

body.falbium-theme-shell .cm-mystery-inner {
	position: relative;
	width: 100%;
	height: 100%;
	transform-style: preserve-3d;
	transition: transform 0.7s cubic-bezier(0.34, 1.4, 0.42, 1);
	cursor: pointer;
}

body.falbium-theme-shell .cm-mystery-inner.is-flipped {
	transform: rotateY(180deg);
	cursor: default;
}

body.falbium-theme-shell .cm-mystery-inner.is-flipping .cm-mystery-front {
	animation: cm-shake 0.4s ease-in-out;
}

@keyframes cm-shake {
	0%, 100% { transform: translateX(0); }
	25% { transform: translateX(-6px) rotate(-2deg); }
	75% { transform: translateX(6px) rotate(2deg); }
}

body.falbium-theme-shell .cm-mystery-front,
body.falbium-theme-shell .cm-mystery-back {
	position: absolute;
	inset: 0;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	border-radius: var(--cm-radius-lg);
	padding: 1.5rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

body.falbium-theme-shell .cm-mystery-front {
	background: linear-gradient(135deg, #2A1B5C 0%, #150B36 100%);
	border: 2px solid rgba(167, 139, 250, 0.4);
	color: #fff;
	text-align: center;
}

body.falbium-theme-shell .cm-mystery-front:hover {
	border-color: rgba(167, 139, 250, 0.85);
	box-shadow: 0 0 60px rgba(167, 139, 250, 0.4);
}

body.falbium-theme-shell .cm-mystery-glow {
	position: absolute;
	inset: -50%;
	background: conic-gradient(from 0deg, transparent, rgba(167, 139, 250, 0.4), transparent, rgba(248, 113, 113, 0.4), transparent);
	animation: cm-glow-spin 8s linear infinite;
	opacity: 0.5;
	pointer-events: none;
}

@keyframes cm-glow-spin {
	to { transform: rotate(360deg); }
}

body.falbium-theme-shell .cm-mystery-icon {
	position: relative;
	z-index: 1;
	margin-bottom: 1rem;
	color: rgba(255, 215, 0, 0.85);
	filter: drop-shadow(0 0 12px rgba(255, 215, 0, 0.4));
}

body.falbium-theme-shell .cm-mystery-question {
	position: absolute;
	font-size: 9rem;
	font-weight: 900;
	color: rgba(255, 255, 255, 0.04);
	right: -10px;
	bottom: -40px;
	font-family: "Manrope", "Inter", sans-serif;
	pointer-events: none;
	z-index: 0;
}

body.falbium-theme-shell .cm-mystery-prompt {
	position: relative;
	z-index: 1;
	font-weight: 700;
	font-size: 1.05rem;
	letter-spacing: 0.02em;
	background: linear-gradient(135deg, #FFD700 0%, #FFA500 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

body.falbium-theme-shell .cm-mystery-back {
	background: linear-gradient(180deg, #1A0F36 0%, #0D0820 100%);
	border: 2px solid rgba(74, 222, 128, 0.4);
	color: #fff;
	transform: rotateY(180deg);
}

body.falbium-theme-shell .cm-mystery-image {
	width: 100%;
	height: 130px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 0.75rem;
}

body.falbium-theme-shell .cm-mystery-image img {
	max-height: 130px;
	max-width: 100%;
	object-fit: contain;
}

body.falbium-theme-shell .cm-mystery-name {
	font-size: 1.05rem;
	font-weight: 700;
	margin-bottom: 0.6rem;
	text-align: center;
	min-height: 2.4rem;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

body.falbium-theme-shell .cm-mystery-price {
	margin-bottom: 0.85rem;
	display: flex;
	align-items: baseline;
	gap: 0.4rem;
	justify-content: center;
}

body.falbium-theme-shell .cm-mystery-strike {
	color: var(--cm-text-subtle);
	text-decoration: line-through;
	font-size: 0.85rem;
}

body.falbium-theme-shell .cm-mystery-final {
	color: #86EFAC;
	font-weight: 800;
	font-size: 1.25rem;
}

/* -------------------------------------------------------------------------
   M9. Vote page — VotingParty card, vote site cards, streak
   ------------------------------------------------------------------------- */

body.falbium-theme-shell .cm-vote-party-card {
	background: linear-gradient(135deg, rgba(139, 92, 246, 0.18) 0%, rgba(76, 29, 149, 0.10) 100%);
	border: 1px solid rgba(139, 92, 246, 0.40);
	box-shadow: 0 12px 36px rgba(139, 92, 246, 0.18);
	overflow: hidden;
	position: relative;
}

body.falbium-theme-shell .cm-vote-party-card::before {
	content: "";
	position: absolute;
	top: -50%;
	right: -20%;
	width: 380px;
	height: 380px;
	background: radial-gradient(circle, rgba(167, 139, 250, 0.20) 0%, transparent 60%);
	pointer-events: none;
}

body.falbium-theme-shell .cm-vote-party-eyebrow {
	font-size: 0.72rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--cm-violet-300);
	font-weight: 700;
	margin-bottom: 0.25rem;
}

body.falbium-theme-shell .cm-vote-party-counter {
	display: inline-flex;
	align-items: baseline;
	gap: 0.15rem;
	letter-spacing: -0.02em;
}

body.falbium-theme-shell .cm-vote-party-current {
	font-size: 2.4rem;
	font-weight: 800;
	color: #fff;
	line-height: 1;
}

body.falbium-theme-shell .cm-vote-party-divider {
	font-size: 1.6rem;
	color: var(--cm-text-subtle);
	font-weight: 400;
}

body.falbium-theme-shell .cm-vote-party-target {
	font-size: 1.4rem;
	color: var(--cm-text-muted);
	font-weight: 600;
}

body.falbium-theme-shell .cm-vote-streak-alert {
	background: linear-gradient(135deg, rgba(252, 211, 77, 0.12) 0%, rgba(245, 158, 11, 0.08) 100%);
	border: 1px solid rgba(252, 211, 77, 0.32);
	color: var(--cm-text);
}

body.falbium-theme-shell .cm-vote-streak-flame {
	font-size: 1.8rem;
	filter: drop-shadow(0 2px 6px rgba(252, 211, 77, 0.4));
}

body.falbium-theme-shell .cm-vote-card {
	transition: transform 0.25s var(--cm-ease), box-shadow 0.25s var(--cm-ease), border-color 0.25s var(--cm-ease);
}

body.falbium-theme-shell .cm-vote-card:hover {
	transform: translateY(-3px);
	border-color: rgba(139, 92, 246, 0.45);
	box-shadow: 0 18px 44px rgba(7, 4, 26, 0.45);
}

body.falbium-theme-shell .cm-vote-card-name {
	font-size: 1.15rem;
	font-weight: 700;
	margin-bottom: 0.5rem;
	color: var(--cm-text);
}

body.falbium-theme-shell .cm-vote-card-status {
	font-size: 0.82rem;
	margin-bottom: 1rem;
	padding: 0.45rem 0.75rem;
	border-radius: 999px;
	display: inline-block;
	font-weight: 600;
}

body.falbium-theme-shell .cm-vote-card-status.is-ready {
	background: rgba(74, 222, 128, 0.14);
	color: #86EFAC;
	border: 1px solid rgba(74, 222, 128, 0.28);
}

body.falbium-theme-shell .cm-vote-card-status.is-cooldown {
	background: rgba(255, 255, 255, 0.05);
	color: var(--cm-text-subtle);
	border: 1px solid rgba(255, 255, 255, 0.08);
}

body.falbium-theme-shell .cm-vote-card-actions {
	display: grid;
	gap: 0.5rem;
}

body.falbium-theme-shell .cm-vote-card-actions .btn.disabled-look {
	opacity: 0.6;
	pointer-events: auto;
}

body.falbium-theme-shell .cm-vote-card-message {
	margin-top: 0.5rem;
	padding: 0.5rem 0.75rem;
	border-radius: var(--cm-radius-sm);
	font-size: 0.82rem;
	font-weight: 500;
}

body.falbium-theme-shell .cm-vote-card-message.is-success {
	background: rgba(74, 222, 128, 0.14);
	color: #86EFAC;
	border: 1px solid rgba(74, 222, 128, 0.28);
}

body.falbium-theme-shell .cm-vote-card-message.is-error {
	background: rgba(248, 113, 113, 0.14);
	color: #FCA5A5;
	border: 1px solid rgba(248, 113, 113, 0.32);
}

body.falbium-theme-shell .cm-vote-card-hint {
	margin-top: 0.4rem;
	padding: 0.4rem 0.6rem;
	border-radius: var(--cm-radius-sm);
	font-size: 0.74rem;
	color: var(--cm-text-subtle);
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid rgba(255, 255, 255, 0.05);
	text-align: center;
}

/* -------------------------------------------------------------------------
   M10. Top voters leaderboard (vote sayfası)
   ------------------------------------------------------------------------- */

body.falbium-theme-shell .cm-vote-period-switch {
	display: inline-flex;
	gap: 0.25rem;
	padding: 0.25rem;
	background: rgba(255, 255, 255, 0.04);
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, 0.06);
}

body.falbium-theme-shell .cm-vote-period-btn {
	border: 0;
	background: transparent;
	color: var(--cm-text-muted);
	font-size: 0.74rem;
	font-weight: 600;
	padding: 0.3rem 0.7rem;
	border-radius: 999px;
	cursor: pointer;
	transition: background 0.18s var(--cm-ease), color 0.18s var(--cm-ease);
}

body.falbium-theme-shell .cm-vote-period-btn:hover {
	color: var(--cm-text);
}

body.falbium-theme-shell .cm-vote-period-btn.is-active {
	background: var(--cm-grad-primary);
	color: #fff;
	box-shadow: 0 4px 12px rgba(139, 92, 246, 0.35);
}

body.falbium-theme-shell .cm-vote-leaderboard {
	counter-reset: leader;
}

body.falbium-theme-shell .cm-vote-leader-item {
	background: transparent !important;
	border-color: rgba(255, 255, 255, 0.04) !important;
	transition: background 0.18s var(--cm-ease);
}

body.falbium-theme-shell .cm-vote-leader-item:hover {
	background: rgba(139, 92, 246, 0.06) !important;
}

body.falbium-theme-shell .cm-vote-leader-rank {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 999px;
	font-size: 0.78rem;
	font-weight: 700;
	background: rgba(255, 255, 255, 0.06);
	color: var(--cm-text-muted);
	border: 1px solid rgba(255, 255, 255, 0.08);
}

body.falbium-theme-shell .cm-vote-leader-item[data-rank="1"] .cm-vote-leader-rank {
	background: linear-gradient(135deg, #FFD700, #FFA500);
	color: #2A1500;
	border-color: rgba(255, 215, 0, 0.65);
	box-shadow: 0 0 12px rgba(255, 215, 0, 0.4);
}
body.falbium-theme-shell .cm-vote-leader-item[data-rank="2"] .cm-vote-leader-rank {
	background: linear-gradient(135deg, #E5E7EB, #9CA3AF);
	color: #1F2937;
	border-color: rgba(229, 231, 235, 0.5);
}
body.falbium-theme-shell .cm-vote-leader-item[data-rank="3"] .cm-vote-leader-rank {
	background: linear-gradient(135deg, #D97706, #92400E);
	color: #FFFAF2;
	border-color: rgba(217, 119, 6, 0.5);
}

body.falbium-theme-shell .cm-vote-leader-item[data-rank="1"] strong {
	color: #FFE9A8;
}

body.falbium-theme-shell .cm-vote-leader-count {
	font-weight: 700;
	color: var(--cm-violet-300);
	font-size: 0.85rem;
	padding: 0.25rem 0.65rem;
	background: rgba(139, 92, 246, 0.14);
	border-radius: 999px;
	border: 1px solid rgba(139, 92, 246, 0.24);
}

body.falbium-theme-shell .cm-vote-leader-item[data-rank="1"] .cm-vote-leader-count {
	color: #FFE9A8;
	background: rgba(255, 215, 0, 0.14);
	border-color: rgba(255, 215, 0, 0.32);
}

/* list-group-numbered'ın varsayılan numaralandırmasını gizle (kendi rank pill'imiz var) */
body.falbium-theme-shell .cm-vote-leaderboard.list-group-numbered > li::before {
	display: none;
}