/*light mode*/
:root {
	--ground: #fff;
	--background: #f7f7f7;
	--light: #cfcfcf;
	--solid: #b1b1b1;
	--disabled: #9e9e9e;
	--strong: #515151;
	--color: #222222;
}

html {
	scroll-behavior: smooth;
}

* {
	margin: 0;
	padding: 0;
	font-family: ARIAL;
}

body {
	background: var(--background);
}

.will-transform {
	will-change: transform;
}

.lazy-image {
	display: "";
}

a {
	text-decoration: none;
	cursor: pointer;
}

select:required:invalid {
	color: var(--disabled);
}

.disabled {
	pointer-events: none;
	opacity: 0.5;
}

.hide-disabled [value=""][disabled] {
	display: none;
}

input,
select,
button {
	background-color: var(--ground)
}

button:focus {
	outline: none;
	box-shadow: none;
}

table {
	border-collapse: collapse;
	word-break: break-all;
}

tr:hover {
	background-color: var(--light);
}

.scroll-y {
	overflow-y: scroll;
}

.scroll-x {
	overflow-x: scroll;
}

.scroll-hide {
	overflow-y: hidden;
	overflow-x: hidden;
}

.scroll-y-hide {
	overflow-y: hidden;
}

.scroll-x-hide {
	overflow-x: hidden;
}

.scroll-y-auto {
	overflow-y: auto;
}

.scroll-x-auto {
	overflow-x: auto;
}

.pointer {
	cursor: pointer;
}

.zoom-in {
	cursor: zoom-in;
}

.zoom-out {
	cursor: zoom-out;
}

.grab {
	cursor: -webkit-grab;
	cursor: -moz-grab;
}

.grab:active {
	cursor: -webkit-grabbing;
	cursor: -moz-grabbing;
}

.carousel-btn {}

.carousel-btn::before {
	content: "";
	position: absolute;
	top: -10px;
	left: -40px;
	right: -5px;
	bottom: -45px;
	cursor: pointer;
	background-color: transparent;
}

.wrap {
	overflow-wrap: break-word;
}

.nowrap {
	white-space: nowrap;
}

.pre-wrap {
	white-space: pre-wrap;
}

.wrapper {
	white-space: normal;
}

.noselect {
	user-select: none;
	/* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
	-o-user-select: none;
	-ms-user-select: none;
	/* Internet Explorer/Edge */
	-moz-user-select: none;
	/* Old versions of Firefox */
	-webkit-user-select: none;
	/* Safari */
	-webkit-touch-callout: none;
	/* iOS Safari */
	-khtml-user-select: none;
	/* Konqueror HTML */
}

.hide-number-arrows::-webkit-inner-spin-button,
.hide-number-arrows::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.hide-number-arrows {
	-moz-appearance: textfield;
}

.hide-in-web {
	display: none;
}

.hide-in-mobile {
	display: initial;
}

.badge {
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
}

.cart-badge {
	position: absolute;
	top: -3px;
	right: -3px;

	min-width: 18px;
	height: 18px;
	padding: 0 4px;

	background: red;
	color: #fff;

	font-size: 12px;
	font-weight: 600;

	border-radius: 999px;

	display: grid;
	place-items: center;

	line-height: 1;
	/* remove interferência */
	box-sizing: border-box;

	transform: translate(0, 0);
	/* evita herança estranha */
}

.msg-window {
	z-index: 9999;
	position: absolute;
	background-color: rgba(128, 128, 128, 0.3);
}

.auth-div {
	position: fixed;
	background-color: var(--strong);
	background-color: rgba(0, 0, 0, 0.5);
	top: 0;
	left: 0;
	height: 100vh;
	width: 100vw;
	z-index: 999;
}

.auth-content {
	position: fixed;
	background-color: white;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	opacity: 1;
}

.msg {
	position: fixed;
	background-color: var(--strong);
	background-color: rgba(0, 0, 0, 0.5);
	top: 0;
	left: 0;
	height: 100vh;
	width: 100vw;
	z-index: 999;
	will-change: transform;
}

.msg-popup {
	position: fixed;
	top: 45%;
	left: 49.5%;
	transform: translate(-50%, -50%);
	opacity: 1;
	will-change: transform;
	max-height: 85%;
	max-width: 99.5%;
}

.msg-popup.fullscreen {
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	max-width: 100vw;
	max-height: 100vh;
	transform: none;
	border-radius: 0;
}

.presentation-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.7);
	z-index: 9999;
}

.presentation-element {
	z-index: 10000;
	pointer-events: none;
}

.presentation-box {
	position: absolute;
	z-index: 10001;
}

::-webkit-scrollbar {
	width: 5px;
}

::-webkit-scrollbar-track {
	background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
	background: #888;
}

::-webkit-scrollbar-thumb:hover {
	background: #555;
}

.scroll-small {
	overflow-y: auto;
}

/* Estilo da barra de rolagem */
.scroll-small::-webkit-scrollbar {
	width: 4px;
	height: 5px;
}

/* Estilo da trilha do scroll */
.scroll-small::-webkit-scrollbar-track {
	background: var(--solid);
}

/* Estilo do indicador de rolagem (thumb) */
.scroll-small::-webkit-scrollbar-thumb {
	background: var(--strong);
}

/* Estilo do canto entre a barra de rolagem e o indicador de rolagem */
.scroll-small::-webkit-scrollbar-corner {
	background: var(--ground);
}

.scroll-line {
	overflow-y: auto;
}

/* Estilo da barra de rolagem */
.scroll-line::-webkit-scrollbar {
	width: 1px;
	height: 1px;
}

/* Estilo da trilha do scroll */
.scroll-line::-webkit-scrollbar-track {
	background: var(--solid);
}

/* Estilo do indicador de rolagem (thumb) */
.scroll-line::-webkit-scrollbar-thumb {
	background: var(--strong);
}

/* Estilo do canto entre a barra de rolagem e o indicador de rolagem */
.scroll-line::-webkit-scrollbar-corner {
	background: var(--ground);
}