@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700;800&display=swap');

:root {
	--brand-50: #f2f7f1;
	--brand-700: #13532a;
	--brand-800: #0f4a22;
	--text: #1f2937;
	--muted: #6b7280;
	--surface: #ffffff;
	--container: 1120px;
}

html,
body {
	height: 100%;
	overflow-x: hidden;
}

body {
	font-family: Inter, ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto,
		'Helvetica Neue', Arial;
	background: var(--brand-50);
	color: var(--text);
}

/* Simple container utility used by shared components (matches landing/styles.css) */
.container {
    width: min(var(--container), calc(100% - 32px));
    margin-inline: auto;
}

/* Header inner fallback for pages where Tailwind overrides .container */
.header__inner {
	width: min(var(--container, 1120px), calc(100% - 32px));
	margin-inline: auto;
	padding-inline: 16px;
}

/* Fallback de utilidades usadas en las vistas (si Tailwind no aplica por algún motivo) */
.bg-brand-50 {
	background-color: var(--brand-50);
}

.bg-brand-700 {
	background-color: var(--brand-700);
}

.bg-brand-800 {
	background-color: var(--brand-800);
}

.border-brand-800 {
	border-color: var(--brand-800);
}

/* Pequeña superficie tipo tarjeta usada en order-tracking */
.panel {
	background: var(--surface);
	border-radius: 8px;
	box-shadow: 0 1px 0 rgba(16, 24, 40, 0.03);
}

/* Utilidad: ocultar scrollbar manteniendo el scroll funcional */
.no-scrollbar::-webkit-scrollbar {
	display: none;
}
.no-scrollbar {
	-ms-overflow-style: none; /* IE y Edge */
	scrollbar-width: none; /* Firefox */
}
