/*  Bootstrap theme start */

:root {
	--blue: var(--color-primary);
	--indigo: #907f9f;
	--purple: #8d5a97;
	--pink: #e83e8c;
	--red: var(--color-error);
	--orange: #fd7e14;
	--yellow: #ffc107;
	--green: #7fc29b;
	--teal: #b8ebd0;
	--cyan: #17a2b8;
	--white: #ffffff;
	--gray: #6c757d;
	--gray-dark: #343a40;
	--primary: var(--color-primary);
	--secondary: var(--color-secondary);
	--success: #04a777;
	--info: var(--cyan);
	--warning: var(--yellow);
	--danger: var(--color-error);
	--light: #f7f9f9;
	--dark: #191923;

	--breakpoint-xs: 0;
	--breakpoint-sm: 576px;
	--breakpoint-md: 768px;
	--breakpoint-lg: 992px;
	--breakpoint-xl: 1200px;

	--font-family-sans-serif: Arial, sans-serif;
	--font-faimly-monospace: Consolas, "Courier New", monospace;
}

.btn-primary,
.bg-primary,
.badge-primary {
	background-color: var(--primary);
}

.btn-secondary,
.bg-secondary,
.badge-secondary {
	background-color: var(--secondary);
}

.text-primary {
	color: var(--primary);
}

.text-secondary {
	color: var(--secondary);
}

/*  Bootstrap theme end */

body {
	margin: 0;
	padding: 0;
	background-color: var(--color-background-0);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-family: sans-serif;
}

/* Myyjätilan visuaaliset muutokset */
body.seller-mode {
	border-top: 4px solid var(--color-secondary);
	position: relative;
}

body.seller-mode::before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 4px;
	background-color: var(--color-secondary);
	z-index: 9999;
	box-shadow: 0 2px 4px rgba(206, 149, 6, 0.3);
}

body>#pageContent {
	display: flex;
	align-items: center;
	flex-direction: column;
}

header,
main,
footer {
	width: 100%;
	max-width: var(--breakpoint-xl);
	padding: var(--padding-large);

	box-sizing: border-box;
}

.container-buttons {
	display: flex;
	flex-direction: row;
	gap: var(--padding-default);
}

table td[number],
table th[number] {
	text-align: end;
}

.row-gap {
	row-gap: var(--padding-default);
}