/*
 * Gemelly — cabeçalho: os três ícones (pesquisa, conta, sacola) no mesmo
 * padrão, e a gaveta da sacola (mini carrinho). Em todas as páginas.
 *
 * Padrão dos ícones: caixa de 42px, desenho de 25px, traço 1.5 no mesmo
 * desenho de 24×24. A conta e a sacola usam a fonte do Bricks (Themify),
 * que tem outro peso e outro alinhamento: aqui o caractere sai e entra o
 * desenho do plugin (máscara com a cor do texto, então a cor escolhida no
 * Bricks continua valendo). Seletores com #brx-header para passar na frente
 * do CSS que o Bricks gera por elemento.
 */

.gml-cab-icones { --gml-cab-tam: 25px; }
html.gml-sacola-aberta { overflow: hidden; }

/* Caixa comum ------------------------------------------------------------ */
#brx-header .gml-cab-icones .gml-pesq__abrir,
#brx-header .gml-cab-icones i.gml-cab-icone,
#brx-header .gml-cab-icone--sacola .cart-icon {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	margin: 0;
	padding: 0;
	border-radius: 50%;
	font-size: 0;
	line-height: 1;
	color: var(--gml-primaria);
	vertical-align: middle;
	transition: background-color var(--gml-transicao), color var(--gml-transicao);
}
#brx-header .gml-cab-icones a:hover .gml-cab-icone,
#brx-header .gml-cab-icones .gml-pesq__abrir:hover,
#brx-header .gml-cab-icone--sacola .mini-cart-link:hover .cart-icon { background: var(--gml-suave); }
#brx-header .gml-cab-icones a:focus-visible { outline: 2px solid var(--gml-acento); outline-offset: 2px; border-radius: 50%; }
#brx-header .gml-cab-icones > a,
#brx-header .gml-cab-icone--sacola .mini-cart-link { display: inline-flex; align-items: center; line-height: 0; }

/* Lupa (SVG próprio) */
#brx-header .gml-cab-icones .gml-pesq__abrir svg { width: var(--gml-cab-tam); height: var(--gml-cab-tam); }

/* Conta e sacola: o desenho entra no lugar do caractere da fonte. */
#brx-header i.gml-cab-icone--conta::before,
#brx-header .gml-cab-icone--sacola .cart-icon > i::before {
	content: "";
	display: block;
	width: var(--gml-cab-tam);
	height: var(--gml-cab-tam);
	background: currentColor;
	-webkit-mask: var(--gml-cab-desenho) center / contain no-repeat;
	mask: var(--gml-cab-desenho) center / contain no-repeat;
}
#brx-header i.gml-cab-icone--conta {
	--gml-cab-desenho: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8.3' r='3.8'/%3E%3Cpath d='M4.8 20c.9-3.9 3.7-6 7.2-6s6.3 2.1 7.2 6'/%3E%3C/svg%3E");
}
#brx-header .gml-cab-icone--sacola {
	--gml-cab-desenho: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.6 8.5h12.8l-1 11.5H6.6Z'/%3E%3Cpath d='M9 8.5V7a3 3 0 0 1 6 0v1.5'/%3E%3C/svg%3E");
}
#brx-header .gml-cab-icone--sacola .cart-icon > i { display: block; font-size: 0; line-height: 0; color: inherit; }

/* Número de itens na sacola: bolinha de 16px no canto de cima da sacola,
   abaixo da alça (a sacola continua reconhecível). Com dois dígitos ela
   só alarga. */
#brx-header .gml-cab-icone--sacola .cart-count {
	position: absolute;
	top: 10px;
	right: 2px;
	bottom: auto;
	left: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 16px;
	width: auto;
	height: 16px;
	padding: 0 4px;
	border: 1.5px solid var(--gml-fundo);
	border-radius: 999px;
	background: var(--gml-acento);
	color: var(--gml-superficie);
	font-family: var(--gml-fonte-texto);
	font-size: 8.5px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0;
	transform: none;
	box-sizing: border-box;
}
#brx-header .gml-cab-icone--sacola.hide-empty-count .cart-count { display: none; }

/* ------------------------------------------------------------------------
 * Gaveta da sacola (mini carrinho)
 * --------------------------------------------------------------------- */
#brx-header .gml-cab-icone--sacola .cart-detail {
	width: min(420px, 100vw);
	max-width: 100vw;
	height: 100vh;
	height: 100dvh;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: var(--gml-fundo);
	box-shadow: -30px 0 60px -30px rgba(46, 35, 30, .5);
	color: var(--gml-texto);
	font-family: var(--gml-fonte-texto);
	font-size: 14px;
	z-index: 10001;
	transition: transform .42s cubic-bezier(.2, .7, .2, 1), visibility .42s;
}
#brx-header .gml-cab-icone--sacola .cart-detail .widget_shopping_cart_content { display: block; height: 100%; padding: 0; }
#brx-header .gml-cab-icone--sacola .off-canvas-overlay {
	background: rgba(46, 35, 30, .42);
	backdrop-filter: blur(3px);
	-webkit-backdrop-filter: blur(3px);
	z-index: 10000;
}
#brx-header .gml-cab-icone--sacola .bricks-mini-cart-close {
	position: absolute;
	top: 22px;
	right: 22px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 1px solid var(--gml-borda);
	border-radius: 50%;
	background: transparent;
	color: var(--gml-primaria);
	font-size: 13px;
	cursor: pointer;
	z-index: 2;
	transition: transform var(--gml-transicao), border-color var(--gml-transicao);
}
#brx-header .gml-cab-icone--sacola .bricks-mini-cart-close:hover { transform: rotate(90deg); border-color: var(--gml-primaria); }

.gml-minicart { display: flex; flex-direction: column; height: 100%; }
.gml-minicart__topo {
	display: flex;
	align-items: baseline;
	gap: 14px;
	padding: 30px 84px 22px 28px;
	border-bottom: 1px solid var(--gml-borda);
}
.gml-minicart__titulo { margin: 0; font-family: var(--gml-fonte-titulo); font-size: 28px; line-height: 1.1; color: var(--gml-primaria); }
.gml-minicart__qtd { font-size: 10.5px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--gml-acento); }

#brx-header .gml-minicart__lista {
	flex: 1 1 auto;
	min-height: 0;
	margin: 0;
	padding: 6px 28px;
	overflow-y: auto;
	list-style: none;
}
#brx-header .gml-minicart__item {
	position: relative;
	display: grid;
	grid-template-columns: 76px minmax(0, 1fr) auto;
	align-items: center;
	gap: 16px;
	margin: 0;
	padding: 18px 0;
	border-bottom: 1px solid var(--gml-borda);
	overflow: visible;
	padding-inline-end: 0;
}
#brx-header .gml-minicart__item:last-child { border-bottom: 0; }
#brx-header .gml-minicart__foto { display: block; width: 76px; height: 92px; overflow: hidden; border-radius: 6px; background: var(--gml-suave); }
#brx-header .gml-minicart__foto img { width: 100%; height: 100%; max-width: none; margin: 0; object-fit: cover; float: none; }
.gml-minicart__info { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.gml-minicart__nome { font-family: var(--gml-fonte-titulo); font-size: 17px; line-height: 1.3; color: var(--gml-primaria); text-decoration: none; }
a.gml-minicart__nome:hover { color: var(--gml-acento); }
.gml-minicart__info dl.variation { display: flex; flex-wrap: wrap; gap: 2px 6px; margin: 0; font-size: 12px; color: var(--gml-texto-suave); }
.gml-minicart__info dl.variation dt, .gml-minicart__info dl.variation dd, .gml-minicart__info dl.variation p { margin: 0; }
.gml-minicart__preco { font-size: 12.5px; letter-spacing: .06em; color: var(--gml-texto-suave); }
#brx-header .gml-minicart__remover {
	position: static;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border: 1px solid var(--gml-borda);
	border-radius: 50%;
	color: var(--gml-texto-suave);
	background: transparent;
	font-size: 0;
	transition: color var(--gml-transicao), border-color var(--gml-transicao), background-color var(--gml-transicao);
}
#brx-header .gml-minicart__remover:hover { border-color: var(--gml-erro); color: var(--gml-erro); background: var(--gml-superficie); }
/* Item saindo (o WooCommerce bloqueia a lista enquanto remove). */
#brx-header .gml-minicart .blockUI.blockOverlay { background: transparent !important; }
#brx-header .gml-minicart .blockUI.blockOverlay::before { display: none; }
#brx-header .gml-minicart__lista:has(.blockUI) { opacity: .55; transition: opacity .2s ease; }

.gml-minicart__rodape { padding: 22px 28px 28px; border-top: 1px solid var(--gml-borda); background: var(--gml-superficie); }
#brx-header .gml-minicart__total {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: var(--gml-primaria);
}
#brx-header .gml-minicart__total strong { font-family: var(--gml-fonte-titulo); font-size: 24px; font-weight: 400; letter-spacing: 0; text-transform: none; }
.gml-minicart__nota { margin: 6px 0 18px; font-size: 12px; color: var(--gml-texto-suave); }
#brx-header .gml-minicart__botoes { display: grid; gap: 10px; margin: 0; }
#brx-header .gml-minicart .button.gml-minicart__finalizar,
#brx-header .gml-minicart .button.gml-minicart__ver {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 52px;
	margin: 0;
	padding: 0 24px;
	border: 1px solid var(--gml-primaria);
	border-radius: 2px;
	font-family: var(--gml-fonte-texto);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .22em;
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color var(--gml-transicao), color var(--gml-transicao), transform var(--gml-transicao);
}
#brx-header .gml-minicart .button.gml-minicart__finalizar { background: var(--gml-primaria); color: var(--gml-fundo); }
#brx-header .gml-minicart .button.gml-minicart__finalizar:hover { transform: translateY(-1px); }
#brx-header .gml-minicart .button.gml-minicart__ver { background: transparent; color: var(--gml-primaria); }
#brx-header .gml-minicart .button.gml-minicart__ver:hover { background: var(--gml-primaria); color: var(--gml-fundo); }

.gml-minicart__vazio {
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 40px 36px 80px;
	text-align: center;
	color: var(--gml-taupe);
}
.gml-minicart__vazio-titulo { margin: 10px 0 0; font-family: var(--gml-fonte-titulo); font-size: 24px; color: var(--gml-primaria); }
.gml-minicart__vazio-texto { margin: 0 0 18px; font-size: 14px; color: var(--gml-texto-suave); }
#brx-header .gml-minicart__vazio .button.gml-minicart__ver { width: auto; }

@media (max-width: 480px) {
	.gml-minicart__topo { padding: 24px 76px 18px 20px; }
	#brx-header .gml-minicart__lista { padding: 4px 20px; }
	.gml-minicart__rodape { padding: 18px 20px 22px; }
	#brx-header .gml-cab-icone--sacola .bricks-mini-cart-close { top: 16px; right: 16px; }
}

/* ------------------------------------------------------------------------
 * Cabeçalho fixo (opção do template do cabeçalho no Bricks): em toda página
 * o conteúdo começa abaixo dele; nas telas da loja (carrinho, checkout,
 * Minha conta, pedido) com mais 50px de respiro. A altura vem medida pelo
 * cabecalho.js (--gml-cab-altura). Com "fixo na rolagem" o próprio Bricks
 * reserva o espaço.
 * --------------------------------------------------------------------- */
body:has(#brx-header.brx-sticky:not(.on-scroll)) #brx-content { padding-top: var(--gml-cab-altura, 88px); }
body.gml-loja:has(#brx-header.brx-sticky:not(.on-scroll)) #brx-content { padding-top: calc(var(--gml-cab-altura, 88px) + 50px); }
