/* Buildtech Cotação & Widgets Elementor — estilos base (front-end) */

.bqw-locked-notice {
	padding: 12px 16px;
	background: #fff4e5;
	border: 1px dashed #dba617;
	border-radius: 6px;
	font-size: 13px;
	color: #7a5b00;
}

/* ---------- Botão gatilho ---------- */
.bqw-trigger-wrap { display: flex; }
.bqw-trigger {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	position: relative;
	cursor: pointer;
	border: 1px solid transparent;
	background-color: #1c8a44;
	color: #fff;
	padding: 12px 22px;
	border-radius: 6px;
	font-size: 15px;
	line-height: 1.2;
	transition: background-color .2s ease, color .2s ease, transform .15s ease;
}
.bqw-trigger:hover { transform: translateY(-1px); }
.bqw-trigger.bqw-added { background-color: #2c974b !important; }
.bqw-trigger-icon svg, .bqw-trigger-icon i { display: block; }

.bqw-cart-counter {
	position: absolute;
	top: -8px;
	right: -8px;
	min-width: 20px;
	height: 20px;
	padding: 0 5px;
	border-radius: 999px;
	background: #e0303e;
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}
.bqw-cart-counter[hidden] { display: none; }

/* ---------- Overlay ---------- */
.bqw-overlay {
	position: fixed;
	inset: 0;
	background: rgba(10, 10, 10, .55);
	z-index: 100000;
	opacity: 0;
	transition: opacity .25s ease;
}
.bqw-overlay.bqw-open { opacity: 1; }
body.bqw-panel-locked { overflow: hidden; }

/* ---------- Painel base (pop-up e sidebar) ---------- */
.bqw-panel {
	position: fixed;
	z-index: 100001;
	background: #fff;
	color: #1a1a1a;
	box-shadow: 0 20px 60px rgba(0,0,0,.25);
	max-height: 92vh;
	overflow-y: auto;
	opacity: 0;
	transition: opacity .3s ease, transform .3s ease;
}
.bqw-panel .bqw-panel-inner { padding: 28px; position: relative; }

.bqw-panel-close {
	position: absolute;
	top: 14px;
	right: 14px;
	width: 32px;
	height: 32px;
	border: none;
	background: rgba(0,0,0,.06);
	border-radius: 50%;
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
	color: inherit;
}
.bqw-panel-close:hover { background: rgba(0,0,0,.12); }

/* A margem direita reserva exatamente o espaço do botão de fechar (cujo
   tamanho é configurável no Elementor) + uma folguinha — em vez de um valor
   fixo, que sobrava espaço demais com o botão no tamanho padrão/menor e
   ficava embaixo do título com um botão maior. O var vem do controle
   "Tamanho do botão" da seção "Botão de Fechar" (ver class-bqw-widget-base.php). */
.bqw-panel-title { margin: 0 calc(var(--bqw-close-size, 32px) + 8px) 16px 0; font-size: 20px; }

/* Modelo Pop-up */
.bqw-panel.bqw-mode-popup {
	top: 50%;
	left: 50%;
	width: 420px;
	border-radius: 18px;
	transform: translate(-50%, -48%) scale(.97);
}
.bqw-panel.bqw-mode-popup.bqw-open { opacity: 1; transform: translate(-50%, -50%) scale(1); }

/* Modelo Sidebar (direita) */
.bqw-panel.bqw-mode-sidebar {
	top: 0;
	right: 0;
	height: 100vh;
	max-height: 100vh; /* sobrescreve o max-height:92vh de .bqw-panel (pensado pro pop-up centralizado) — a sidebar deve sempre ocupar a tela inteira, de cima a baixo. */
	width: 420px;
	border-radius: 0;
	transform: translateX(100%);
}
.bqw-panel.bqw-mode-sidebar.bqw-open { opacity: 1; transform: translateX(0); }

/* ---------- Liquid Glass (iOS) ---------- */
.bqw-panel.bqw-glass {
	background: rgba(255, 255, 255, 0.55);
	-webkit-backdrop-filter: blur(24px) saturate(180%);
	backdrop-filter: blur(24px) saturate(180%);
	border: 1px solid rgba(255, 255, 255, 0.35);
}
@media (prefers-color-scheme: dark) {
	.bqw-panel.bqw-glass {
		background: rgba(30, 30, 34, 0.55);
		border: 1px solid rgba(255, 255, 255, 0.12);
	}
}
.bqw-panel.bqw-glass .bqw-panel-close { background: rgba(255,255,255,.35); backdrop-filter: blur(6px); }

/* ---------- Resumo do produto ---------- */
.bqw-product-summary { display: flex; gap: 14px; align-items: center; margin-bottom: 18px; }
.bqw-product-thumb { width: 64px; height: 64px; object-fit: cover; border-radius: 10px; flex-shrink: 0; }
.bqw-product-name { font-weight: 600; }
.bqw-product-price { color: #1c8a44; font-weight: 600; margin-top: 2px; }

/* ---------- Formulário ---------- */
.bqw-field { margin-bottom: 14px; }
.bqw-field label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px; }
.bqw-required { color: #e0303e; }
.bqw-field input, .bqw-field textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 10px 12px;
	border: 1px solid #dcdcdc;
	border-radius: 8px;
	font-size: 14px;
	background: rgba(255,255,255,.7);
	color: inherit;
}
.bqw-field input:focus, .bqw-field textarea:focus { outline: none; border-color: #1c8a44; }

.bqw-submit {
	width: 100%;
	padding: 13px 18px;
	border: 1px solid #1c8a44;
	background: #1c8a44;
	color: #fff;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	transition: opacity .2s ease, background-color .2s ease, color .2s ease, border-color .2s ease, filter .2s ease;
}
/* Efeito padrão no hover (funciona mesmo sem configurar nada na seção
   "Botão Enviar" do Elementor); as cores de hover de lá, se configuradas,
   se somam a este efeito — mesmo padrão usado nos botões do Slide/Grid. */
.bqw-submit:hover:not(:disabled) { filter: brightness(0.92); }
.bqw-submit:disabled { opacity: .6; cursor: default; }
.bqw-submit.bqw-loading { opacity: .75; }

.bqw-form-message { min-height: 18px; font-size: 13px; margin: 4px 0 12px; }
.bqw-form-message.bqw-success { color: #1c8a44; }
.bqw-form-message.bqw-error { color: #e0303e; }

/* ---------- Lista de cotação (carrinho) ---------- */
.bqw-cart-list { margin-bottom: 18px; max-height: 40vh; overflow-y: auto; }
.bqw-cart-empty { color: #888; font-size: 14px; }
.bqw-cart-item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 0;
	border-bottom: 1px solid #ececec;
}
.bqw-cart-item-thumb { width: 56px; height: 56px; object-fit: cover; border-radius: 8px; flex-shrink: 0; }
.bqw-cart-item-info { flex: 1; min-width: 0; }
.bqw-cart-item-name { font-weight: 600; font-size: 14px; }
.bqw-cart-item-price { color: #1c8a44; font-size: 13px; }
.bqw-cart-item-remove {
	border: none;
	background: rgba(0,0,0,.06);
	width: 26px;
	height: 26px;
	border-radius: 50%;
	font-size: 16px;
	cursor: pointer;
	flex-shrink: 0;
}
.bqw-cart-item-remove:hover { background: rgba(224,48,62,.15); color: #e0303e; }

/* =====================================================================
   Carrossel (logos/conteúdo)
   ===================================================================== */
.bqw-carousel .swiper { padding-bottom: 40px; }
.bqw-carousel-card {
	height: 100%;
	background: #fff;
	border-radius: 10px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
}
.bqw-carousel-image { width: 100%; overflow: hidden; }
.bqw-carousel-image img { display: block; width: 100%; height: 100%; }
.bqw-carousel-content { padding: 18px; flex: 1; display: flex; flex-direction: column; gap: 8px; }
/* O alinhamento (esquerda/centro/direita) vem de uma classe, não de CSS
   inline: o botão é inline-block dentro de um flex column, então precisa
   de align-items (que usa flex-start/flex-end) além de text-align (que usa
   left/right) — uma classe deixa os dois corretos ao mesmo tempo. */
.bqw-carousel-content.bqw-align-left { align-items: flex-start; text-align: left; }
.bqw-carousel-content.bqw-align-center { align-items: center; text-align: center; }
.bqw-carousel-content.bqw-align-right { align-items: flex-end; text-align: right; }
.bqw-carousel-title { font-weight: 700; font-size: 16px; }
.bqw-carousel-text { font-size: 14px; line-height: 1.5; }
.bqw-carousel-btn {
	display: inline-block;
	margin-top: auto;
	padding: 8px 16px;
	border-radius: 6px;
	background: #1c8a44;
	color: #fff;
	text-decoration: none;
	font-size: 13px;
	font-weight: 600;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease, filter .2s ease;
}
.bqw-carousel-btn:hover { filter: brightness(0.9); }

/* =====================================================================
   Slide (hero)
   ===================================================================== */
.bqw-slide-widget .swiper { border-radius: 4px; overflow: hidden; } /* valor padrão; sobrescrito pelo controle "Arredondamento do slider" no Elementor */
.bqw-slide-item { position: relative; height: 480px; overflow: hidden; }
.bqw-slide-item.bqw-slide-fullheight { height: 100vh; }
.bqw-slide-image { position: absolute; inset: 0; }
.bqw-slide-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bqw-slide-image .bqw-slide-image-mobile { display: none; }
@media (max-width: 767px) {
	.bqw-slide-image .bqw-slide-image-desktop.bqw-has-mobile { display: none; }
	.bqw-slide-image .bqw-slide-image-mobile { display: block; }
}
.bqw-slide-overlay { position: absolute; inset: 0; background: rgba(0,0,0,.35); }
.bqw-slide-content-wrap {
	position: relative;
	z-index: 2;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 5%;
	box-sizing: border-box;
}
.bqw-slide-content { max-width: 50%; color: #fff; }
.bqw-slide-title { margin: 0 0 14px; font-size: clamp(24px, 4vw, 46px); color: #fff; }
.bqw-slide-text { font-size: 16px; line-height: 1.6; margin-bottom: 20px; color: #f2f2f2; }
.bqw-slide-buttons { display: flex; gap: 12px; flex-wrap: wrap; }
.bqw-slide-btn-1, .bqw-slide-btn-2 {
	display: inline-block;
	padding: 12px 24px;
	border-radius: 6px;
	text-decoration: none;
	font-weight: 600;
	border: 2px solid transparent;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease, filter .2s ease, transform .15s ease;
}
.bqw-slide-btn-1 { background: #1c8a44; color: #fff; }
.bqw-slide-btn-2 { background: transparent; color: #fff; border-color: #fff; }
/* Efeito padrão no hover (funciona mesmo sem configurar cor de hover no
   Elementor — deixa o botão visivelmente "vivo" ao passar o mouse); as
   cores de hover na aba "Botões" do widget, se configuradas, se somam a
   este efeito. */
.bqw-slide-btn-1:hover, .bqw-slide-btn-2:hover { filter: brightness(0.9); transform: translateY(-1px); }

/* Navegação Swiper compartilhada — setas/dots ficam fora do .swiper (como
   irmãos, dentro de .bqw-swiper-wrap) justamente para poder posicioná-las
   fora da imagem sem serem cortadas pelo overflow:hidden do slider. */
.bqw-swiper-wrap { position: relative; }
/* width/height "auto" + transform pra centralizar verticalmente, em vez de
   depender do cálculo de largura/altura fixo padrão do Swiper (baseado em
   --swiper-navigation-size) — assim o padding/fundo/arredondamento
   configurados no Elementor funcionam num botão que cresce com o conteúdo. */
.bqw-swiper-wrap .swiper-button-next, .bqw-swiper-wrap .swiper-button-prev {
	color: #1a1a1a;
	z-index: 5;
	top: 50%;
	margin-top: 0;
	transform: translateY(-50%);
	width: auto;
	height: auto;
	display: flex;
	align-items: center;
	justify-content: center;
}
.bqw-swiper-wrap .swiper-button-next:after, .bqw-swiper-wrap .swiper-button-prev:after { font-size: 20px; }
/* Com ícone customizado, some com o glifo padrão do Swiper. */
.bqw-swiper-wrap .swiper-button-next.bqw-custom-icon:after, .bqw-swiper-wrap .swiper-button-prev.bqw-custom-icon:after { display: none; }
.bqw-swiper-wrap .swiper-button-next i, .bqw-swiper-wrap .swiper-button-prev i { font-size: 20px; }
.bqw-swiper-wrap .swiper-button-next svg, .bqw-swiper-wrap .swiper-button-prev svg { width: 20px; height: 20px; fill: currentColor; }
.bqw-swiper-wrap .swiper-pagination { z-index: 5; }
.bqw-swiper-wrap .swiper-pagination-bullet { opacity: 1; background: #ccc; }
.bqw-swiper-wrap .swiper-pagination-bullet-active { background: #1c8a44; }

/* Setas fora do elemento — a largura do próprio slider "encolhe" pela
   distância configurada (padding do wrap), abrindo espaço nas laterais
   para as setas ficarem fora da imagem/card. */
.bqw-swiper-wrap.bqw-arrows-outside { box-sizing: border-box; }
.bqw-swiper-wrap.bqw-arrows-outside .swiper-button-prev { left: 0; }
.bqw-swiper-wrap.bqw-arrows-outside .swiper-button-next { right: 0; }

/* =====================================================================
   Grid
   ===================================================================== */
.bqw-grid-wrap { width: 100%; }
.bqw-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.bqw-grid-item { background: #fff; border-radius: 10px; overflow: hidden; }
.bqw-grid-item-link { display: block; color: inherit; text-decoration: none; }
.bqw-grid-image { width: 100%; height: 200px; overflow: hidden; }
.bqw-grid-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.bqw-grid-content { padding: 16px; }
.bqw-grid-title { font-weight: 700; font-size: 16px; margin-bottom: 4px; }
.bqw-grid-price { color: #1c8a44; font-weight: 600; font-size: 14px; margin-bottom: 6px; }
.bqw-grid-excerpt { font-size: 14px; color: #666; line-height: 1.5; margin-bottom: 10px; }
.bqw-grid-btn {
	display: inline-block;
	font-size: 13px;
	font-weight: 700;
	color: #1c8a44;
	padding: 6px 4px;
	border-radius: 4px;
	background-color: transparent;
	transition: background-color .2s ease, color .2s ease;
}
/* Efeito padrão no hover (funciona mesmo sem configurar cor de hover no
   Elementor) — as cores da aba "Botões"/"Hover" do widget, se
   configuradas, se somam a este efeito. */
.bqw-grid-btn:hover { filter: brightness(0.9); }
.bqw-grid-pagination { display: flex; justify-content: center; margin-top: 28px; }
.bqw-grid-load-more {
	padding: 12px 28px;
	border: 1px solid #1c8a44;
	background: transparent;
	color: #1c8a44;
	border-radius: 8px;
	cursor: pointer;
	font-weight: 600;
	transition: background-color .2s ease, color .2s ease;
}
.bqw-grid-load-more:hover { background: #1c8a44; color: #fff; }
.bqw-grid-load-more:disabled { opacity: .6; cursor: default; }

/* =====================================================================
   Menu (widget 7)
   ===================================================================== */
.bqw-menu-wrap { position: relative; }
.bqw-menu-toggle {
	align-items: center;
	gap: 8px;
	background: none;
	border: none;
	cursor: pointer;
	padding: 6px;
	color: inherit;
	font-size: 22px;
	line-height: 1;
}
.bqw-menu-toggle-icon svg, .bqw-menu-toggle-icon i { display: block; }
.bqw-menu-toggle-label { font-size: 14px; font-weight: 600; }

.bqw-menu-list { display: flex; list-style: none; margin: 0; padding: 0; gap: 28px; }
.bqw-menu-vertical .bqw-menu-list { flex-direction: column; }
.bqw-menu-list .menu-item { position: relative; }
.bqw-menu-list .menu-item > a { display: inline-block; text-decoration: none; color: #1a1a1a; padding: 6px 2px; }
.bqw-menu-list .menu-item-has-children > a::after,
.bqw-menu-list .bqw-has-children > a::after {
	content: "";
	display: inline-block;
	width: 6px;
	height: 6px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(45deg);
	margin-left: 6px;
	vertical-align: middle;
}

/* Submenu — horizontal: dropdown flutuante. */
.bqw-menu-horizontal .sub-menu {
	list-style: none;
	margin: 0;
	padding: 8px 0;
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 220px;
	background: #fff;
	box-shadow: 0 12px 30px rgba(0,0,0,.12);
	border-radius: 8px;
	z-index: 20;
	display: none;
}
.bqw-menu-horizontal[data-dropdown-trigger="hover"] .menu-item:hover > .sub-menu { display: block; }
.bqw-menu-horizontal[data-dropdown-trigger="click"] .menu-item.bqw-submenu-open > .sub-menu { display: block; }
.bqw-menu-horizontal .sub-menu .sub-menu { top: 0; left: 100%; }
.bqw-menu-horizontal .sub-menu a { display: block; padding: 8px 18px; text-decoration: none; color: #1a1a1a; white-space: nowrap; }
.bqw-menu-horizontal .sub-menu a:hover { background: #f5f5f5; }

/* Submenu — vertical: expande inline (indentado), sem flutuar. */
.bqw-menu-vertical .sub-menu {
	list-style: none;
	margin: 4px 0 4px 14px;
	padding: 0;
	display: none;
}
.bqw-menu-vertical[data-dropdown-trigger="hover"] .menu-item:hover > .sub-menu { display: block; }
.bqw-menu-vertical[data-dropdown-trigger="click"] .menu-item.bqw-submenu-open > .sub-menu { display: block; }
.bqw-menu-vertical .sub-menu a { display: block; padding: 6px 0; text-decoration: none; color: #1a1a1a; }

/* Painel mobile (abaixo do breakpoint definido no widget). Fundo neutro aqui
   só como fallback — a aparência de verdade do painel (fundo, sombra,
   max-height/overflow, centralização, tamanho de fonte, Liquid Glass) é
   gerada pelo próprio widget dentro do <style> inline, DENTRO do media query
   do breakpoint (que é configurável por instância). Já existiu uma versão
   dessas regras aqui, sem media query, baseada só nas classes
   bqw-menu-mobile-dropdown/-fullscreen/-glass do wrapper — só que essas
   classes ficam no wrapper o tempo todo (não só abaixo do breakpoint), então
   o overflow-y:auto + max-height do ".bqw-menu-nav" acabava cortando o
   dropdown do menu horizontal no DESKTOP também (o recorte por overflow vale
   pra qualquer filho, mesmo position:absolute) — bug corrigido na v1.1.3. */
.bqw-menu-nav { background: #fff; }

/* =====================================================================
   Responsivo
   ===================================================================== */
@media (max-width: 767px) {
	.bqw-panel.bqw-mode-popup,
	.bqw-panel.bqw-mode-sidebar { width: 100% !important; }
	.bqw-slide-content { max-width: 90%; }
}
