/* Mr Casinos Online — design tokens (ported from lovable-reference/src/styles.css) */

:root {
	--mrc-black: #05070d;
	--mrc-navy: #090d15;
	--mrc-surface-dark: #10151e;
	--mrc-surface-dark-alt: #151b25;
	--mrc-dark-surface: var(--mrc-surface-dark);
	--mrc-dark-surface-raised: var(--mrc-surface-dark-alt);
	--mrc-gold: #c79a3b;
	--mrc-gold-light: #e1c46d;
	--mrc-gold-dark: #87631f;
	--mrc-ivory: #f4efe4;
	--mrc-warm-white: #fbf9f4;
	--mrc-page-light: #f2efe8;
	--mrc-white: #ffffff;
	--mrc-card-light: #ffffff;
	--mrc-text: #171717;
	--mrc-text-dark: #171717;
	--mrc-text-light: #eee9df;
	--mrc-text-muted-dark: #686762;
	--mrc-text-muted-light: #aaa69d;
	--mrc-border-light: #ddd8ce;
	--mrc-border-dark: rgba(199, 154, 59, 0.2);
	--mrc-success: #287b4b;
	--mrc-warning: #a97016;
	--mrc-danger: #a43c3c;
	--mrc-accent: var(--mrc-gold);
	--mrc-surface-light: var(--mrc-warm-white);
	--mrc-border: var(--mrc-border-light);

	--mrc-radius: 0.625rem;
	--mrc-radius-sm: calc(var(--mrc-radius) - 4px);
	--mrc-radius-md: calc(var(--mrc-radius) - 2px);
	--mrc-radius-lg: var(--mrc-radius);

	--mrc-shadow-sm: 0 1px 2px rgba(5, 7, 13, 0.06);
	--mrc-shadow-md: 0 8px 24px rgba(5, 7, 13, 0.12);
	--mrc-shadow-lg: 0 16px 40px rgba(5, 7, 13, 0.16);

	--mrc-header-height: 104px;
	--mrc-header-brand-row-height: 54px;
	--mrc-header-nav-row-height: 50px;
	--mrc-header-mobile-height: 54px;

	--mrc-container-max: 1240px;
	--mrc-page-padding: 20px;
	--mrc-focus-ring: 2px solid var(--mrc-gold);

	--mrc-transition-fast: 150ms ease;
	--mrc-transition-base: 200ms ease;
	--mrc-transition-slow: 300ms ease;

	--mrc-font-sans: Manrope, Arial, sans-serif;
	--mrc-font-serif: var(--mrc-font-sans);
}

@media (min-width: 640px) {
	:root {
		--mrc-page-padding: 32px;
	}
}

@media (min-width: 1024px) {
	:root {
		--mrc-page-padding: 48px;
	}
}

@media (min-width: 1440px) {
	:root {
		--mrc-page-padding: 56px;
	}
}

@media (max-width: 767px) {
	:root {
		--mrc-header-height: 54px;
	}
}

.mrc-container {
	box-sizing: border-box;
	width: min(calc(100% - (var(--mrc-page-padding) * 2)), var(--mrc-container-max));
	margin-inline: auto;
	padding-inline: 0;
}

.mrc-container *,
.mrc-container *::before,
.mrc-container *::after {
	box-sizing: border-box;
}
