/* ============================================================
   FORA DO TABLET
   ============================================================ */

.leo-tablet-catalog-toolbar,
.leo-tablet-filter-drawer {
	display: none;
}


/* ============================================================
   TABLET
   ============================================================ */

@media
(min-width: 768px)
and
(max-width: 1024px) {


	/* ========================================================
	   FUNDO
	   ======================================================== */

	body.woocommerce.archive .site-main {
		background: #f5f6f7;
	}


	/* ========================================================
	   SIDEBAR FIXA SOME
	   ======================================================== */

	body.woocommerce.archive
	.ct-sidebar {
		display: none !important;
	}


	/* ========================================================
	   CONTEÚDO EM LARGURA TOTAL
	   ======================================================== */

	body.woocommerce.archive
	[data-sidebar] {

		display: block !important;

		grid-template-columns:
			1fr !important;
	}


	body.woocommerce.archive
	.ct-content-area {

		width: 100% !important;
		max-width: 100% !important;

		margin: 0 !important;
	}


	/* ========================================================
	   NÃO USAR TOOLBAR MOBILE
	   ======================================================== */

	.leo-v3-mobile-catalog {
		display: none !important;
	}


	/* ========================================================
	   ORDENAÇÃO DESKTOP FORA DO LUGAR
	   ======================================================== */

	.leo-v3-desktop-ordering {
		display: none !important;
	}


	/* ========================================================
	   CONTAGEM NATIVA
	   ======================================================== */

	.woocommerce-result-count {
		display: none !important;
	}


	/* ========================================================
	   TOOLBAR TABLET
	   ======================================================== */

	.leo-tablet-catalog-toolbar {

		display: block !important;

		width: 100%;

		margin:
			18px
			0
			18px;

		padding: 0;
	}


	.leo-tablet-toolbar-row {

		display: flex;

		align-items: center;
		justify-content: space-between;

		gap: 16px;

		width: 100%;
	}


	/* ========================================================
	   BOTÃO FILTROS
	   ======================================================== */

	.leo-tablet-filter-button {

		display: flex;

		align-items: center;
		justify-content: center;

		gap: 8px;

		width: 150px;
		height: 46px;

		margin: 0;

		padding:
			0
			18px;

		background: #ffffff;

		border:
			1px solid
			#dddddd;

		border-radius: 9px;

		color: #333333;

		font-family: inherit;
		font-size: 14px;
		font-weight: 500;

		cursor: pointer;

		box-shadow:
			0 1px 2px
			rgba(0,0,0,.03);
	}


	.leo-tablet-filter-button svg {
		color: #f1b900;
	}


	/* ========================================================
	   ORDENAÇÃO
	   ======================================================== */

	.leo-tablet-order-target {

		display: flex;

		align-items: center;
		justify-content: flex-end;

		margin-left: auto;
	}


	.leo-tablet-order-target::before {

		content: "Ordenar por";

		margin-right: 10px;

		color: #606060;

		font-family: inherit;
		font-size: 13px;
		font-weight: 400;
	}


	.leo-tablet-order-target
	.leo-v3-desktop-ordering {

		display: block !important;

		margin: 0 !important;
		padding: 0 !important;
	}


	.leo-tablet-order-target
	.woocommerce-ordering {

		display: block !important;

		float: none !important;

		margin: 0 !important;
		padding: 0 !important;
	}


	.leo-tablet-order-target
	select.orderby {

		width: 190px !important;

		height: 46px !important;
		min-height: 46px !important;

		margin: 0 !important;

		padding:
			0
			38px
			0
			14px !important;

		background: #ffffff !important;

		border:
			1px solid
			#dddddd !important;

		border-radius: 9px !important;

		color: #333333 !important;

		font-family: inherit !important;
		font-size: 13px !important;

		box-shadow: none !important;
	}


	/* ========================================================
	   RESULTADOS
	   ======================================================== */

	.leo-tablet-results {

		margin:
			18px
			0
			0;

		color: #696969;

		font-family: inherit;
		font-size: 13px;
		font-weight: 400;
	}


	/* ========================================================
	   GRID — 4 COLUNAS
	   ======================================================== */

	body.woocommerce.archive
	ul.products {

		display: grid !important;

		grid-template-columns:
			repeat(
				4,
				minmax(0, 1fr)
			) !important;

		column-gap:
			9px !important;

		row-gap:
			12px !important;

		width: 100% !important;

		margin: 0 !important;
		padding: 0 !important;
	}


	body.woocommerce.archive
	ul.products::before,

	body.woocommerce.archive
	ul.products::after {

		display: none !important;

		content: none !important;
	}


	/* ========================================================
	   CARD
	   ======================================================== */

	body.woocommerce.archive
	ul.products
	li.product {

		position: relative !important;

		display: flex !important;
		flex-direction: column !important;

		min-width: 0 !important;

		width: 100% !important;
		height: 100% !important;

		float: none !important;

		margin: 0 !important;

		padding:
			10px
			10px
			11px !important;

		background:
			#ffffff !important;

		border:
			1px solid
			#e1e3e5 !important;

		border-radius:
			15px !important;

		box-shadow:
			none !important;

		box-sizing:
			border-box !important;

		overflow:
			hidden !important;
	}


	/* ========================================================
	   LINK
	   ======================================================== */

	body.woocommerce.archive
	ul.products
	li.product
	.woocommerce-LoopProduct-link,

	body.woocommerce.archive
	ul.products
	li.product
	.woocommerce-loop-product__link {

		display: block !important;

		width: 100% !important;

		color: inherit !important;

		text-decoration: none !important;
	}


	/* ========================================================
	   IMAGEM
	   ======================================================== */

	body.woocommerce.archive
	ul.products
	li.product
	.ct-image-container,

	body.woocommerce.archive
	ul.products
	li.product
	.ct-media-container {

		display: flex !important;

		align-items: center !important;
		justify-content: center !important;

		width: 100% !important;

		height: 150px !important;
		min-height: 150px !important;
		max-height: 150px !important;

		margin:
			0
			0
			10px !important;

		padding: 0 !important;

		background: transparent !important;

		overflow: hidden !important;
	}


	body.woocommerce.archive
	ul.products
	li.product img {

		display: block !important;

		width: 100% !important;
		max-width: 130px !important;

		height: 145px !important;
		max-height: 145px !important;

		margin:
			0
			auto !important;

		object-fit: contain !important;
		object-position: center !important;
	}


	/* ========================================================
	   TÍTULO
	   ======================================================== */

	body.woocommerce.archive
	ul.products
	li.product
	.woocommerce-loop-product__title,

	body.woocommerce.archive
	ul.products
	li.product h2 {

		display:
			-webkit-box !important;

		-webkit-box-orient:
			vertical !important;

		-webkit-line-clamp:
			2 !important;

		overflow: hidden !important;

		width: 100% !important;

		min-height:
			38px !important;

		max-height:
			38px !important;

		margin:
			0
			0
			9px !important;

		padding: 0 !important;

		color:
			#272727 !important;

		font-family:
			inherit !important;

		font-size:
			12.5px !important;

		font-weight:
			500 !important;

		line-height:
			1.5 !important;

		text-align:
			left !important;
	}


	/* ========================================================
	   ESCONDER TAXONOMIAS
	   ======================================================== */

	body.woocommerce.archive
	ul.products
	li.product
	.star-rating,

	body.woocommerce.archive
	ul.products
	li.product
	.ct-product-categories,

	body.woocommerce.archive
	ul.products
	li.product
	.product-categories,

	body.woocommerce.archive
	ul.products
	li.product
	.product_meta,

	body.woocommerce.archive
	ul.products
	li.product
	[class*="taxonomy"] {

		display: none !important;
	}


	/* ========================================================
	   PREÇO
	   ======================================================== */

	body.woocommerce.archive
	ul.products
	li.product
	.price {

		display: block !important;

		width: 100% !important;

		min-height:
			23px !important;

		margin:
			0
			0
			6px !important;

		padding: 0 !important;

		color:
			#111111 !important;

		font-family:
			inherit !important;

		font-size:
			15px !important;

		font-weight:
			700 !important;

		line-height:
			1.25 !important;

		text-align:
			left !important;
	}


	body.woocommerce.archive
	ul.products
	li.product
	.price
	.amount {

		color:
			#111111 !important;

		font-size:
			inherit !important;

		font-weight:
			700 !important;
	}


	body.woocommerce.archive
	ul.products
	li.product
	.price
	del {

		color:
			#999999 !important;

		font-size:
			11px !important;

		font-weight:
			400 !important;

		opacity: 1 !important;
	}


	body.woocommerce.archive
	ul.products
	li.product
	.price
	ins {

		background:
			transparent !important;

		text-decoration:
			none !important;
	}


	/* ========================================================
	   PARCELAMENTO
	   ======================================================== */

	body.woocommerce.archive
	ul.products
	li.product
	small,

	body.woocommerce.archive
	ul.products
	li.product
	[class*="installment"],

	body.woocommerce.archive
	ul.products
	li.product
	[class*="parcel"],

	body.woocommerce.archive
	ul.products
	li.product
	[class*="payment"] {

		color:
			#707070 !important;

		font-family:
			inherit !important;

		font-size:
			10px !important;

		line-height:
			1.4 !important;
	}


	/* ========================================================
	   BOTÃO ADICIONAR
	   ======================================================== */

	body.woocommerce.archive
	ul.products
	li.product
	.button {

		display: flex !important;

		align-items: center !important;
		justify-content: center !important;

		gap: 6px !important;

		width: 100% !important;

		height: 40px !important;
		min-height: 40px !important;
		max-height: 40px !important;

		margin:
			auto
			0
			0 !important;

		padding:
			0
			7px !important;

		background:
			#19875c !important;

		border: 0 !important;

		border-radius:
			9px !important;

		box-shadow:
			none !important;

		color:
			#ffffff !important;

		font-family:
			inherit !important;

		/*
		 * Texto nativo fica visível por padrão.
		 * Só a adição direta recebe decoração JS abaixo.
		 */
		font-size:
			12px !important;

		font-weight:
			700 !important;

		white-space:
			nowrap !important;

		overflow:
			hidden !important;
	}


	/* ========================================================
	   CARRINHO SVG
	   ======================================================== */

	body.woocommerce.archive
	ul.products
	li.product
	.button
	.leo-tablet-cart-icon {

		display:
			inline-flex !important;

		align-items:
			center !important;

		justify-content:
			center !important;

		flex:
			0
			0
			15px !important;

		width:
			15px !important;

		height:
			15px !important;

		color:
			#ffffff !important;
	}


	body.woocommerce.archive
	ul.products
	li.product
	.button
	.leo-tablet-cart-icon
	svg {

		display:
			block !important;

		width:
			15px !important;

		height:
			15px !important;

		fill:
			none !important;

		stroke:
			#ffffff !important;
	}


	/* ========================================================
	   TEXTO ADICIONAR
	   ======================================================== */

	body.woocommerce.archive
	ul.products
	li.product
	.button
	.leo-tablet-add-text {

		display:
			inline-block !important;

		color:
			#ffffff !important;

		font-family:
			inherit !important;

		font-size:
			12px !important;

		font-weight:
			700 !important;

		line-height:
			1 !important;
	}


	/* ========================================================
	   SELO OFERTA
	   ======================================================== */

	body.woocommerce.archive
	ul.products
	li.product
	.onsale {

		position:
			absolute !important;

		top:
			9px !important;

		left:
			9px !important;

		z-index:
			5 !important;

		min-width:
			auto !important;

		min-height:
			auto !important;

		margin: 0 !important;

		padding:
			5px
			6px !important;

		background:
			#ef3d43 !important;

		border-radius:
			8px !important;

		color:
			#ffffff !important;

		font-size:
			10px !important;

		font-weight:
			700 !important;

		line-height:
			1.05 !important;
	}


	/* ========================================================
	   DRAWER
	   ======================================================== */

	.leo-tablet-filter-drawer {

		display: block;

		position: fixed;

		inset: 0;

		z-index:
			9999999;

		visibility:
			hidden;

		pointer-events:
			none;
	}


	.leo-tablet-filter-drawer.is-open {

		visibility:
			visible;

		pointer-events:
			auto;
	}


	/* ========================================================
	   FUNDO ESCURO
	   ======================================================== */

	.leo-tablet-filter-overlay {

		position: absolute;

		inset: 0;

		background:
			rgba(0,0,0,.45);

		opacity: 0;

		transition:
			opacity .25s ease;
	}


	.leo-tablet-filter-drawer.is-open
	.leo-tablet-filter-overlay {

		opacity: 1;
	}


	/* ========================================================
	   PAINEL
	   ======================================================== */

	.leo-tablet-filter-panel {

		position: absolute;

		top: 0;
		left: 0;
		bottom: 0;

		display: flex;

		flex-direction: column;

		width:
			min(
				55vw,
				430px
			);

		height: 100dvh;

		margin: 0;
		padding: 0;

		background:
			#ffffff;

		box-shadow:
			8px 0 30px
			rgba(0,0,0,.18);

		transform:
			translateX(-102%);

		transition:
			transform .27s ease;

		overflow: hidden;
	}


	.leo-tablet-filter-drawer.is-open
	.leo-tablet-filter-panel {

		transform:
			translateX(0);
	}


	/* ========================================================
	   CABEÇALHO DO PAINEL
	   ======================================================== */

	.leo-tablet-filter-header {

		flex: 0 0 auto;

		display: flex;

		align-items: center;
		justify-content: space-between;

		height: 66px;

		padding:
			0
			20px;

		background:
			#ffffff;

		border-bottom:
			1px solid
			#e8e8e8;
	}


	.leo-tablet-filter-header strong {

		color: #181818;

		font-family: inherit;
		font-size: 21px;
		font-weight: 700;
	}


	/* ========================================================
	   BOTÃO X
	   ======================================================== */

	.leo-tablet-filter-close {

		display: flex;

		align-items: center;
		justify-content: center;

		width: 40px;
		height: 40px;

		margin: 0;
		padding: 0;

		background: transparent;

		border: 0;

		color: #222222;

		cursor: pointer;
	}


	.leo-tablet-filter-close svg {

		width: 23px;
		height: 23px;

		fill: none;

		stroke: currentColor;

		stroke-width: 1.7;

		stroke-linecap: round;
	}


	/* ========================================================
	   CONTEÚDO FILTROS
	   ======================================================== */

	.leo-tablet-filter-content {

		flex: 1 1 auto;

		min-height: 0;

		padding:
			20px
			20px
			32px;

		overflow-y: auto;
		overflow-x: hidden;

		background:
			#ffffff;

		-webkit-overflow-scrolling:
			touch;
	}


	.leo-tablet-filter-content
	.wc-block-product-filters {

		display: block !important;

		position: static !important;

		width: 100% !important;
		height: auto !important;

		margin: 0 !important;
		padding: 0 !important;

		overflow: visible !important;
	}


	/*
	 * Não queremos botão "Filtrar produtos"
	 * dentro do nosso drawer.
	 */

	.leo-tablet-filter-content
	.wc-block-product-filters__open-overlay {

		display: none !important;
	}


	/*
	 * Impede uma segunda gaveta do Woo
	 * dentro da nossa.
	 */

	.leo-tablet-filter-content
	.wc-block-product-filters__overlay {

		display: none !important;
	}


	/* ========================================================
	   SCROLL DA PÁGINA
	   ======================================================== */

	html.leo-tablet-filter-open,
	body.leo-tablet-filter-open {

		overflow:
			hidden !important;
	}

}