/* Minimal UI kit classes to match expected naming */
:root{
  --accent:#7c5cff;
  --card-bg:rgba(255,255,255,0.06);
  --card-border:rgba(255,255,255,0.12);
}
[data-bs-theme="dark"]{
  --bs-body-bg:#0f1115;
  --bs-body-color:#dee2e6;
}

.card-soft{
  background:var(--card-bg);
  border:1px solid var(--card-border);
  border-radius:.75rem;
}
/* Modern Button Design - Casino Theme */
.btn {
	position: relative;
	overflow: hidden;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	font-weight: 600;
	border: 2px solid transparent;
	box-shadow: 
		0 4px 15px rgba(0, 0, 0, 0.2),
		inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.btn::before {
	content: '';
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
	transition: left 0.5s;
}

.btn:hover::before {
	left: 100%;
}

.btn:active {
	transform: translateY(1px);
	box-shadow: 
		0 2px 8px rgba(0, 0, 0, 0.3),
		inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.btn-accent {
	--bs-btn-bg: #00bf63;
	background: linear-gradient(135deg, #00bf63, #00a657) !important;
	--bs-btn-border-color: rgba(0, 191, 99, 0.5);
	border-color: rgba(0, 191, 99, 0.5) !important;
	--bs-btn-hover-bg: #00a657;
	--bs-btn-hover-border-color: rgba(0, 191, 99, 0.8);
	--bs-btn-color: #fff;
	color: #fff !important;
	box-shadow: 
		0 4px 20px rgba(0, 191, 99, 0.3),
		inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.btn-accent:hover,
.btn-accent:focus {
	background: linear-gradient(135deg, #00a657, #008f4a) !important;
	border-color: rgba(0, 191, 99, 0.8) !important;
	box-shadow: 
		0 6px 25px rgba(0, 191, 99, 0.4),
		inset 0 1px 0 rgba(255, 255, 255, 0.3),
		0 0 20px rgba(0, 191, 99, 0.2);
	transform: translateY(-2px);
	color: #fff !important;
}

.btn-primary {
	background: linear-gradient(135deg, #0d6efd, #0b5ed7) !important;
	border-color: rgba(13, 110, 253, 0.5) !important;
	color: #fff !important;
	box-shadow: 
		0 4px 20px rgba(13, 110, 253, 0.3),
		inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.btn-primary:hover,
.btn-primary:focus {
	background: linear-gradient(135deg, #0b5ed7, #0a58ca) !important;
	border-color: rgba(13, 110, 253, 0.8) !important;
	box-shadow: 
		0 6px 25px rgba(13, 110, 253, 0.4),
		inset 0 1px 0 rgba(255, 255, 255, 0.3);
	transform: translateY(-2px);
	color: #fff !important;
}

.btn-secondary {
	background: linear-gradient(135deg, #6c757d, #5c636a) !important;
	border-color: rgba(108, 117, 125, 0.5) !important;
	color: #fff !important;
	box-shadow: 
		0 4px 20px rgba(108, 117, 125, 0.3),
		inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.btn-secondary:hover,
.btn-secondary:focus {
	background: linear-gradient(135deg, #5c636a, #495057) !important;
	border-color: rgba(108, 117, 125, 0.8) !important;
	box-shadow: 
		0 6px 25px rgba(108, 117, 125, 0.4),
		inset 0 1px 0 rgba(255, 255, 255, 0.3);
	transform: translateY(-2px);
	color: #fff !important;
}

.btn-success {
	background: linear-gradient(135deg, #198754, #157347) !important;
	border-color: rgba(25, 135, 84, 0.5) !important;
	color: #fff !important;
	box-shadow: 
		0 4px 20px rgba(25, 135, 84, 0.3),
		inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.btn-success:hover,
.btn-success:focus {
	background: linear-gradient(135deg, #157347, #146c43) !important;
	border-color: rgba(25, 135, 84, 0.8) !important;
	box-shadow: 
		0 6px 25px rgba(25, 135, 84, 0.4),
		inset 0 1px 0 rgba(255, 255, 255, 0.3);
	transform: translateY(-2px);
	color: #fff !important;
}

.btn-danger {
	background: linear-gradient(135deg, #dc3545, #bb2d3b) !important;
	border-color: rgba(220, 53, 69, 0.5) !important;
	color: #fff !important;
	box-shadow: 
		0 4px 20px rgba(220, 53, 69, 0.3),
		inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.btn-danger:hover,
.btn-danger:focus {
	background: linear-gradient(135deg, #bb2d3b, #b02a37) !important;
	border-color: rgba(220, 53, 69, 0.8) !important;
	box-shadow: 
		0 6px 25px rgba(220, 53, 69, 0.4),
		inset 0 1px 0 rgba(255, 255, 255, 0.3);
	transform: translateY(-2px);
	color: #fff !important;
}

.btn-warning {
	background: linear-gradient(135deg, #ffc107, #ffb300) !important;
	border-color: rgba(255, 193, 7, 0.5) !important;
	color: #000 !important;
	box-shadow: 
		0 4px 20px rgba(255, 193, 7, 0.3),
		inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.btn-warning:hover,
.btn-warning:focus {
	background: linear-gradient(135deg, #ffb300, #ffa000) !important;
	border-color: rgba(255, 193, 7, 0.8) !important;
	box-shadow: 
		0 6px 25px rgba(255, 193, 7, 0.4),
		inset 0 1px 0 rgba(255, 255, 255, 0.3);
	transform: translateY(-2px);
	color: #000 !important;
}

.btn-info {
	background: linear-gradient(135deg, #0dcaf0, #0aa2c0) !important;
	border-color: rgba(13, 202, 240, 0.5) !important;
	color: #000 !important;
	box-shadow: 
		0 4px 20px rgba(13, 202, 240, 0.3),
		inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.btn-info:hover,
.btn-info:focus {
	background: linear-gradient(135deg, #0aa2c0, #098ba3) !important;
	border-color: rgba(13, 202, 240, 0.8) !important;
	box-shadow: 
		0 6px 25px rgba(13, 202, 240, 0.4),
		inset 0 1px 0 rgba(255, 255, 255, 0.3);
	transform: translateY(-2px);
	color: #000 !important;
}

.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-success,
.btn-outline-danger,
.btn-outline-warning,
.btn-outline-info,
.btn-outline-light,
.btn-outline-dark,
.btn-outline-accent {
	background: transparent;
	position: relative;
	overflow: hidden;
	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
	font-weight: 600;
	box-shadow: 
		0 2px 10px rgba(0, 0, 0, 0.1),
		inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.btn-outline-primary:hover,
.btn-outline-secondary:hover,
.btn-outline-success:hover,
.btn-outline-danger:hover,
.btn-outline-warning:hover,
.btn-outline-info:hover,
.btn-outline-light:hover,
.btn-outline-dark:hover {
	transform: translateY(-2px);
	box-shadow: 
		0 4px 15px rgba(0, 0, 0, 0.2),
		inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.btn-outline-accent {
	color: #00bf63;
	border-color: rgba(0, 191, 99, 0.5);
}

.btn-outline-accent:hover {
	background: linear-gradient(135deg, rgba(0, 191, 99, 0.15), rgba(0, 166, 87, 0.15));
	border-color: rgba(0, 191, 99, 0.8);
	color: #00bf63;
	box-shadow: 
		0 4px 15px rgba(0, 191, 99, 0.2),
		inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.btn-sm {
	padding: 0.375rem 0.75rem;
	font-size: 0.875rem;
	box-shadow: 
		0 2px 8px rgba(0, 0, 0, 0.15),
		inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.btn-lg {
	padding: 0.75rem 1.5rem;
	font-size: 1.125rem;
	box-shadow: 
		0 6px 25px rgba(0, 0, 0, 0.25),
		inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.btn:disabled,
.btn.disabled {
	opacity: 0.6;
	cursor: not-allowed;
	transform: none !important;
	box-shadow: 
		0 2px 8px rgba(0, 0, 0, 0.1),
		inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

.btn:disabled:hover,
.btn.disabled:hover {
	transform: none !important;
}
.badge-accent{background:var(--accent);}
.table-soft tbody tr{background:transparent;border-bottom:1px solid var(--card-border);} 
.progress-soft{background:rgba(255,255,255,0.08);} 

.claim-box{max-width:520px;margin:0 auto;}
.countdown-display{font-size:3rem;font-weight:700;letter-spacing:.05em;}

/* Copy toast — light mint, matches site redesign */
.toast-copy {
	--toast-accent: #00a857;
	--toast-ink: #122018;
	--toast-muted: #5a6f63;
	--toast-line: rgba(18, 32, 24, 0.1);
	position: fixed;
	top: 1.1rem;
	right: 1.1rem;
	z-index: 9999;
	width: min(360px, calc(100vw - 2rem));
	pointer-events: none;
}

.toast-copy.custom-toast {
	pointer-events: auto;
	background:
		linear-gradient(135deg, rgba(255, 255, 255, 0.97), rgba(231, 246, 238, 0.95));
	border: 1px solid var(--toast-line);
	border-radius: 14px;
	box-shadow:
		0 12px 32px rgba(18, 32, 24, 0.1),
		0 2px 8px rgba(0, 168, 87, 0.06);
	color: var(--toast-ink);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	overflow: hidden;
}

.toast-copy.custom-toast.showing,
.toast-copy.custom-toast.show:not(.hide) {
	animation: toast-copy-in 0.34s cubic-bezier(0.22, 1, 0.36, 1);
}

.toast-copy.custom-toast::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 3px;
	background: linear-gradient(180deg, #00bf63, #00a857);
}

.toast-copy__inner {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	padding: 0.85rem 0.85rem 0.85rem 1rem;
}

.toast-copy__icon {
	flex: 0 0 auto;
	width: 2.35rem;
	height: 2.35rem;
	border-radius: 11px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #e7f6ee;
	color: var(--toast-accent);
	font-size: 1.15rem;
	line-height: 1;
}

.toast-copy__content {
	flex: 1 1 auto;
	min-width: 0;
	padding-top: 0.1rem;
}

.toast-copy__title {
	display: block;
	font-family: Outfit, 'DM Sans', system-ui, sans-serif;
	font-size: 0.92rem;
	font-weight: 750;
	letter-spacing: -0.02em;
	color: var(--toast-ink);
	line-height: 1.2;
}

.toast-copy .toast-body {
	padding: 0.2rem 0 0;
	font-family: 'DM Sans', system-ui, sans-serif;
	font-size: 0.82rem;
	font-weight: 500;
	line-height: 1.4;
	color: var(--toast-muted);
}

.toast-copy__close {
	flex: 0 0 auto;
	width: 1.85rem;
	height: 1.85rem;
	margin: -0.15rem -0.1rem 0 0;
	padding: 0;
	border: 0;
	border-radius: 8px;
	background: transparent;
	color: var(--toast-muted);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 0.78rem;
	line-height: 1;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease;
}

.toast-copy__close:hover,
.toast-copy__close:focus-visible {
	background: rgba(18, 32, 24, 0.06);
	color: var(--toast-ink);
	outline: none;
}

@keyframes toast-copy-in {
	from {
		opacity: 0;
		transform: translateY(-10px) translateX(12px);
	}
	to {
		opacity: 1;
		transform: translateY(0) translateX(0);
	}
}

@media (max-width: 575.98px) {
	.toast-copy {
		top: auto;
		bottom: 1rem;
		right: 1rem;
		left: 1rem;
		width: auto;
	}

	@keyframes toast-copy-in {
		from {
			opacity: 0;
			transform: translateY(14px);
		}
		to {
			opacity: 1;
			transform: translateY(0);
		}
	}
}



