@charset "UTF-8";

/* Esconder elementos */
.ssif-body .hide {
	display: none !important;
	visibility: hidden !important;
	opacity: 0 !important;
	position: absolute !important;
	top: 0px !important;
	left: 0px !important;
	width: 0px !important;
	height: 0px !important;
	min-width: 0px !important;
	min-height: 0px !important;
	max-width: 0px !important;
	max-height: 0px !important;
	overflow: hidden !important;
}

/* Esconder elementos conforme a resolução */
@media only screen and (max-width: 767px) {
	.ssif-body :where(.hide-on-small,.hide-on-medium,.show-on-medium,.show-on-large) {
		display: none !important;
		visibility: hidden !important;
		opacity: 0 !important;
		position: absolute !important;
		top: 0px !important;
		left: 0px !important;
		width: 0px !important;
		height: 0px !important;
		min-width: 0px !important;
		min-height: 0px !important;
		max-width: 0px !important;
		max-height: 0px !important;
		overflow: hidden !important;
	}
}
@media only screen and (min-width: 768px) and (max-width: 989px) {
	.ssif-body :where(.hide-on-medium,.show-on-small,.show-on-large) {
		display: none !important;
		visibility: hidden !important;
		opacity: 0 !important;
		position: absolute !important;
		top: 0px !important;
		left: 0px !important;
		width: 0px !important;
		height: 0px !important;
		min-width: 0px !important;
		min-height: 0px !important;
		max-width: 0px !important;
		max-height: 0px !important;
		overflow: hidden !important;
	}
}
@media only screen and (min-width: 990px) {
	.ssif-body :where(.hide-on-large,.show-on-small,.show-on-medium) {
		display: none !important;
		visibility: hidden !important;
		opacity: 0 !important;
		position: absolute !important;
		top: 0px !important;
		left: 0px !important;
		width: 0px !important;
		height: 0px !important;
		min-width: 0px !important;
		min-height: 0px !important;
		max-width: 0px !important;
		max-height: 0px !important;
		overflow: hidden !important;
	}
}

/* Esconder elementos conforme o tipo */
.ssif-body.is-mobile :where(.hide-on-mobile,.hide-on-tablet,.show-on-desktop),
.ssif-body:not(.is-mobile) :where(.hide-on-desktop,.show-on-mobile,.show-on-tablet) {
	display: none !important;
	visibility: hidden !important;
	opacity: 0 !important;
	position: absolute !important;
	top: 0px !important;
	left: 0px !important;
	width: 0px !important;
	height: 0px !important;
	min-width: 0px !important;
	min-height: 0px !important;
	max-width: 0px !important;
	max-height: 0px !important;
	overflow: hidden !important;
}

/* Mostrar/esconder elemento se estiver ou não logado */
.ssif-body.user-logged-in .hide-on-logged,
.ssif-body:not(.user-logged-in) .show-on-logged {
	display: none !important;
	visibility: hidden !important;
	opacity: 0 !important;
	position: absolute !important;
	top: 0px !important;
	left: 0px !important;
	width: 0px !important;
	height: 0px !important;
	min-width: 0px !important;
	min-height: 0px !important;
	max-width: 0px !important;
	max-height: 0px !important;
	overflow: hidden !important;
}

/* Não clicavel */
.ssif-body .no-clickable { pointer-events: none !important; }

/* Sempre no topo */
.ssif-body .always-on-top { z-index: 99999 !important; }

/* Largura máxima */
.ssif-body .mw-100p { max-width: 100% !important; }
.ssif-body .mw-100vw { max-width: 100vw !important; }
.ssif-body .mw-100vh { max-width: 100vh !important; }

/* Altura máxima 100% */
.ssif-body .mh-100p { max-height: 100% !important; }
.ssif-body .mh-100vw { max-height: 100vw !important; }
.ssif-body .mh-100vh { max-height: 100vh !important; }

/* Flex */
.ssif-body .d-flex { display: flex !important; }
.ssif-body .d-inline-flex { display: inline-flex !important; }
.ssif-body .flex-fill { flex: 1 1 auto !important; }
.ssif-body .flex-fixed { flex: 0 0 auto !important; }
.ssif-body .flex-row { flex-direction: row !important; }
.ssif-body .flex-column { flex-direction: column !important; }
.ssif-body .flex-row-reverse { flex-direction: row-reverse !important; }
.ssif-body .flex-column-reverse { flex-direction: column-reverse !important; }
.ssif-body .flex-grow-0 { flex-grow: 0 !important; }
.ssif-body .flex-grow-1 { flex-grow: 1 !important; }
.ssif-body .flex-shrink-0 { flex-shrink: 0 !important; }
.ssif-body .flex-shrink-1 { flex-shrink: 1 !important; }
.ssif-body .flex-wrap { flex-wrap: wrap !important; }
.ssif-body .flex-nowrap { flex-wrap: nowrap !important; }
.ssif-body .flex-wrap-reverse { flex-wrap: wrap-reverse !important; }

.ssif-body .justify-content-start { justify-content: flex-start !important; }
.ssif-body .justify-content-end { justify-content: flex-end !important; }
.ssif-body .justify-content-center { justify-content: center !important; }
.ssif-body .justify-content-between { justify-content: space-between !important; }
.ssif-body .justify-content-around { justify-content: space-around !important; }
.ssif-body .justify-content-evenly { justify-content: space-evenly !important; }

.ssif-body .align-items-start { align-items: flex-start !important; }
.ssif-body .align-items-end { align-items: flex-end !important; }
.ssif-body .align-items-center { align-items: center !important; }
.ssif-body .align-items-baseline { align-items: baseline !important; }
.ssif-body .align-items-stretch { align-items: stretch !important; }

.ssif-body .align-content-start { align-content: flex-start !important; }
.ssif-body .align-content-end { align-content: flex-end !important; }
.ssif-body .align-content-center { align-content: center !important; }
.ssif-body .align-content-between { align-content: space-between !important; }
.ssif-body .align-content-around { align-content: space-around !important; }
.ssif-body .align-content-stretch { align-content: stretch !important; }

.ssif-body .align-self-auto { align-self: auto !important; }
.ssif-body .align-self-start { align-self: flex-start !important; }
.ssif-body .align-self-end { align-self: flex-end !important; }
.ssif-body .align-self-center { align-self: center !important; }
.ssif-body .align-self-baseline { align-self: baseline !important; }
.ssif-body .align-self-stretch { align-self: stretch !important; }

.ssif-body .order-first { order: -1 !important; }
.ssif-body .order-0 { order: 0 !important; }
.ssif-body .order-1 { order: 1 !important; }
.ssif-body .order-2 { order: 2 !important; }
.ssif-body .order-3 { order: 3 !important; }
.ssif-body .order-4 { order: 4 !important; }
.ssif-body .order-5 { order: 5 !important; }
.ssif-body .order-last { order: 6 !important; }

.ssif-body .gap-0 { gap: 0 !important; }
.ssif-body .gap-1 { gap: .25rem !important; }
.ssif-body .gap-2 { gap: .5rem !important; }
.ssif-body .gap-3 { gap: 1rem !important; }
.ssif-body .gap-4 { gap: 1.5rem !important; }
.ssif-body .gap-5 { gap: 3rem !important; }
.ssif-body .row-gap-0 { row-gap: 0 !important; }
.ssif-body .row-gap-1 { row-gap: .25rem !important; }
.ssif-body .row-gap-2 { row-gap: .5rem !important; }
.ssif-body .row-gap-3 { row-gap: 1rem !important; }
.ssif-body .row-gap-4 { row-gap: 1.5rem !important; }
.ssif-body .row-gap-5 { row-gap: 3rem !important; }
.ssif-body .column-gap-0 { -moz-column-gap: 0 !important; column-gap: 0 !important; }
.ssif-body .column-gap-1 { -moz-column-gap: 0.25rem !important; column-gap: .25rem !important; }
.ssif-body .column-gap-2 { -moz-column-gap: 0.5rem !important; column-gap: .5rem !important; }
.ssif-body .column-gap-3 { -moz-column-gap: 1rem !important; column-gap: 1rem !important; }
.ssif-body .column-gap-4 { -moz-column-gap: 1.5rem !important; column-gap: 1.5rem !important; }
.ssif-body .column-gap-5 { -moz-column-gap: 3rem !important; column-gap: 3rem !important; }

/* Indicador de barra de rolagem */
.ssif-body.is-mobile .scroll-indicator {
	position: relative;
	/*overflow-y: auto;*/
	/*-webkit-overflow-scrolling: touch;*/
	&::before, &::after {
		content: '';
		display: flex;
		position: sticky;
		left: calc(100% - 6px);
		width: 0;
		height: 0;
		border-left: 12px solid transparent;
		border-right: 12px solid transparent;
		opacity: 0;
		transition: opacity 0.3s;
		pointer-events: none;
		z-index: 999999;
		filter: drop-shadow(1px 1px 0px white) drop-shadow(-1px -1px 0px white) drop-shadow(-1px 1px 0px white) drop-shadow(1px -1px 0px white);
	}

	&::before {
		top: 0px;
		border-bottom: 12px solid currentColor;
	}

	&::after {
		bottom: 0px;
		border-top: 12px solid currentColor;
	}

	&.scroll-active::before, &.scroll-active::after {
		opacity: 1;
	}

	&.scroll-top::before, &.scroll-bottom::after {
		opacity: 0 !important;
	}

	@media only screen and (max-width: 767px) {
		&::before, &::after {
			opacity: 1 !important;
		}
	}

}