/*! Âmbar 1.0.0 para LaraClassifier. Montado pelo motor Futuro 1.0.0.
    Fontes: SIL Open Font License 1.1 (veja fonts/LICENCAS.txt). */

@font-face {
	font-family: 'Orbitron';
	font-style: normal;
	font-weight: 400 900;
	font-display: swap;
	src: url('../fonts/orbitron.woff2') format('woff2');
}
@font-face {
	font-family: 'Exo 2';
	font-style: normal;
	font-weight: 100 900;
	font-display: swap;
	src: url('../fonts/exo-2.woff2') format('woff2');
}
@font-face {
	font-family: 'Rajdhani';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('../fonts/rajdhani-400.woff2') format('woff2');
}
@font-face {
	font-family: 'Rajdhani';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('../fonts/rajdhani-500.woff2') format('woff2');
}
@font-face {
	font-family: 'Rajdhani';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('../fonts/rajdhani-600.woff2') format('woff2');
}
@font-face {
	font-family: 'Rajdhani';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('../fonts/rajdhani-700.woff2') format('woff2');
}
@font-face {
	font-family: 'Chakra Petch';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('../fonts/chakra-petch-400.woff2') format('woff2');
}
@font-face {
	font-family: 'Chakra Petch';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('../fonts/chakra-petch-500.woff2') format('woff2');
}
@font-face {
	font-family: 'Chakra Petch';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('../fonts/chakra-petch-600.woff2') format('woff2');
}
@font-face {
	font-family: 'Chakra Petch';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('../fonts/chakra-petch-700.woff2') format('woff2');
}
@font-face {
	font-family: 'Titillium Web';
	font-style: normal;
	font-weight: 300;
	font-display: swap;
	src: url('../fonts/titillium-web-300.woff2') format('woff2');
}
@font-face {
	font-family: 'Titillium Web';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('../fonts/titillium-web-400.woff2') format('woff2');
}
@font-face {
	font-family: 'Titillium Web';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('../fonts/titillium-web-600.woff2') format('woff2');
}
@font-face {
	font-family: 'Titillium Web';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('../fonts/titillium-web-700.woff2') format('woff2');
}
@font-face {
	font-family: 'Share Tech Mono';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('../fonts/share-tech-mono.woff2') format('woff2');
}

:root {
	--bs-primary: #f2a900;
	--bs-primary-rgb: 242, 169, 0;
	--bs-link-color: #f2a900;
	--bs-link-color-rgb: 242, 169, 0;
	--bs-body-font-family: 'Titillium Web', sans-serif;
	--theme-heading-font: 'Rajdhani', sans-serif;
	--ft-acento-base: #ffd166;
	--ft-raio: 2px;
	--ft-recorte: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);
	--ft-grade-tamanho: 48px;
	--ft-titulos-caixa: uppercase;
	--ft-titulos-espaco: .1em;
	--ft-capa-espaco: .14em;
	--ft-botao-fim: color-mix(in srgb, var(--ft-acao) 62%, var(--ft-acento));
	--ft-fonte-anuncio: var(--theme-heading-font, inherit);
}

/* Modo claro */
:root,
[data-bs-theme="light"] {
	--ft-fundo: #f6f1e6;
	--ft-fundo-rgb: 246, 241, 230;
	--ft-painel: #fffdf7;
	--ft-painel-rgb: 255, 253, 247;
	--ft-painel-2: #fbf6ea;
	--ft-painel-2-rgb: 251, 246, 234;
	--ft-vidro: rgba(255, 253, 247, .82);
	--ft-vidro-forte: rgba(251, 246, 234, .94);
	--ft-linha: #e6dcc4;
	--ft-linha-rgb: 230, 220, 196;
	--ft-linha-forte: #c1b69a;
	--ft-texto: #2a2416;
	--ft-texto-rgb: 42, 36, 22;
	--ft-forte: #15100a;
	--ft-forte-rgb: 21, 16, 10;
	--ft-suave: #6b5c38;
	--ft-suave-rgb: 107, 92, 56;
	--ft-sobre-acao: #140e00;
	--ft-sobre-acento: #140e00;
	--ft-preco: #8f5f00;
	--ft-rodape: #eee6d3;
	--ft-grade: color-mix(in srgb, var(--ft-acao) 7%, transparent);
	--ft-grade-capa: rgba(242, 169, 0, .1);
	--ft-linhas-tela: .02;
	--ft-brilho: .2;
	--ft-capa-fundo: linear-gradient(160deg, #15100a, #3d2c08);
	--ft-capa-titulo: #ffe6a3;
	--ft-capa-subtitulo: #dcc894;
	--ft-capa-sombra: 0 0 calc(var(--ft-brilho) * 28px) color-mix(in srgb, var(--ft-acao) 70%, transparent), 0 2px 0 rgba(0, 0, 0, .25);
	--ft-acao-texto: color-mix(in srgb, var(--ft-acao) 52%, #000);
	--ft-sombra: 0 1px 2px rgba(16, 24, 40, .06), 0 12px 30px -18px rgba(16, 24, 40, .22);
	--ft-filtro-fechar: none;
}

/* Modo escuro */
[data-bs-theme="dark"] {
	--ft-fundo: #070604;
	--ft-fundo-rgb: 7, 6, 4;
	--ft-painel: #100d08;
	--ft-painel-rgb: 16, 13, 8;
	--ft-painel-2: #17130b;
	--ft-painel-2-rgb: 23, 19, 11;
	--ft-vidro: rgba(16, 13, 8, .8);
	--ft-vidro-forte: rgba(23, 19, 11, .92);
	--ft-linha: #2e2614;
	--ft-linha-rgb: 46, 38, 20;
	--ft-linha-forte: #54482e;
	--ft-texto: #e8dcc0;
	--ft-texto-rgb: 232, 220, 192;
	--ft-forte: #fff6dc;
	--ft-forte-rgb: 255, 246, 220;
	--ft-suave: #ab986b;
	--ft-suave-rgb: 171, 152, 107;
	--ft-sobre-acao: #140e00;
	--ft-sobre-acento: #140e00;
	--ft-preco: #ffc53d;
	--ft-rodape: #050403;
	--ft-grade: color-mix(in srgb, var(--ft-acao) 5.5%, transparent);
	--ft-grade-capa: rgba(242, 169, 0, .08);
	--ft-linhas-tela: .03;
	--ft-brilho: .65;
	--ft-capa-fundo: linear-gradient(160deg, #0b0906, #2e2006);
	--ft-capa-titulo: #ffe6a3;
	--ft-capa-subtitulo: #d2be8e;
	--ft-capa-sombra: 0 0 calc(var(--ft-brilho) * 28px) color-mix(in srgb, var(--ft-acao) 70%, transparent), 0 2px 0 rgba(0, 0, 0, .25);
	--ft-acao-texto: color-mix(in srgb, var(--ft-acao) 85%, #fff);
	--ft-sombra: inset 0 1px 0 rgba(255, 255, 255, .03), 0 18px 40px -26px rgba(0, 0, 0, .95);
	--ft-filtro-fechar: invert(1) grayscale(100%) brightness(200%);
}

/* ==========================================================================
   Futuro: camada visual dos temas gerados para o LaraClassifier.
   Tudo sai das variáveis --ft-* (paleta do tema, modo claro e escuro) e das
   variáveis que o próprio LaraClassifier escreve a partir de Admin > Temas >
   Configurações (--bs-primary, --theme-accent-color, fontes). Mudou lá,
   muda aqui.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Bootstrap ligado à paleta
   -------------------------------------------------------------------------- */
:root,
[data-bs-theme] {
	--ft-acao: var(--bs-primary);
	--ft-acento: var(--theme-accent-color, var(--ft-acento-base));
	--ft-mono: 'Share Tech Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;

	--bs-body-bg: var(--ft-fundo);
	--bs-body-bg-rgb: var(--ft-fundo-rgb);
	--bs-body-color: var(--ft-texto);
	--bs-body-color-rgb: var(--ft-texto-rgb);
	--bs-emphasis-color: var(--ft-forte);
	--bs-emphasis-color-rgb: var(--ft-forte-rgb);
	--bs-secondary-color: rgba(var(--ft-suave-rgb), .95);
	--bs-secondary-color-rgb: var(--ft-suave-rgb);
	--bs-secondary-bg: var(--ft-painel-2);
	--bs-secondary-bg-rgb: var(--ft-painel-2-rgb);
	--bs-tertiary-color: rgba(var(--ft-suave-rgb), .75);
	--bs-tertiary-color-rgb: var(--ft-suave-rgb);
	--bs-tertiary-bg: var(--ft-painel);
	--bs-tertiary-bg-rgb: var(--ft-painel-rgb);
	--bs-heading-color: var(--ft-forte);
	--bs-border-color: var(--ft-linha);
	--bs-border-color-translucent: rgba(var(--ft-linha-rgb), .7);
	--bs-border-radius: var(--ft-raio);
	--bs-border-radius-sm: calc(var(--ft-raio) * .6);
	--bs-border-radius-lg: calc(var(--ft-raio) * 1.4);
	--bs-border-radius-xl: calc(var(--ft-raio) * 1.8);
	--bs-border-radius-xxl: calc(var(--ft-raio) * 2.4);
	--bs-box-shadow: var(--ft-sombra);
	--bs-box-shadow-sm: 0 2px 10px -4px rgba(0, 0, 0, .35);
	--bs-link-hover-color: var(--ft-acento);
	--bs-focus-ring-color: color-mix(in srgb, var(--ft-acao) 45%, transparent);
	--bs-primary-text-emphasis: color-mix(in srgb, var(--ft-acao) 70%, var(--ft-forte));
	--bs-primary-bg-subtle: color-mix(in srgb, var(--ft-acao) 14%, var(--ft-painel));
	--bs-primary-border-subtle: color-mix(in srgb, var(--ft-acao) 40%, var(--ft-linha));
	--bs-secondary-bg-subtle: var(--ft-painel-2);
	--bs-secondary-border-subtle: var(--ft-linha);
	--bs-light-bg-subtle: var(--ft-painel-2);
	--bs-light-border-subtle: var(--ft-linha);
	--bs-light-text-emphasis: var(--ft-forte);
}

html {
	scrollbar-color: color-mix(in srgb, var(--ft-acao) 55%, var(--ft-painel)) var(--ft-fundo);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

::selection {
	background: color-mix(in srgb, var(--ft-acao) 38%, transparent);
	color: var(--ft-forte);
}

::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-track { background: var(--ft-fundo); }
::-webkit-scrollbar-thumb {
	background: color-mix(in srgb, var(--ft-acao) 45%, var(--ft-painel));
	border: 3px solid var(--ft-fundo);
	border-radius: 10px;
}

/* --------------------------------------------------------------------------
   2. Fundo da página: grade fina e brilho
   -------------------------------------------------------------------------- */
body {
	font-family: var(--bs-body-font-family);
	background-color: var(--ft-fundo);
	color: var(--ft-texto);
	letter-spacing: .01em;
}

body::before {
	content: '';
	position: fixed;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background-image:
		radial-gradient(1100px 620px at 12% -12%, color-mix(in srgb, var(--ft-acao) calc(var(--ft-brilho) * 34%), transparent), transparent 70%),
		radial-gradient(900px 560px at 100% 4%, color-mix(in srgb, var(--ft-acento) calc(var(--ft-brilho) * 20%), transparent), transparent 70%),
		linear-gradient(var(--ft-grade) 1px, transparent 1px),
		linear-gradient(90deg, var(--ft-grade) 1px, transparent 1px);
	background-size: auto, auto, var(--ft-grade-tamanho) var(--ft-grade-tamanho), var(--ft-grade-tamanho) var(--ft-grade-tamanho);
}

main,
footer {
	position: relative;
}

a {
	transition: color .18s ease, text-shadow .18s ease;
}

/* Links soltos no texto: cor da ação ajustada ao modo (mais clara no escuro).
   :where() mantém a força do seletor igual à do Bootstrap, então classes como
   .nav-link e .dropdown-item continuam mandando. */
:where(html) a {
	color: var(--ft-acao-texto);
}

:where(html) a:hover {
	color: var(--ft-forte);
}

/* .link-primary (categorias, títulos e ações dos anúncios) usa a cor pura com
   !important no Bootstrap; aqui vale a versão ajustada ao modo. */
html .link-primary {
	color: var(--ft-acao-texto) !important;
	text-decoration-color: color-mix(in srgb, var(--ft-acao-texto) 50%, transparent) !important;
}

html .link-primary:hover,
html .link-primary:focus-visible {
	color: var(--ft-forte) !important;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
	font-family: var(--theme-heading-font, inherit);
	color: var(--ft-forte);
	letter-spacing: .01em;
}

.text-body-emphasis {
	color: var(--ft-forte) !important;
}

hr {
	border-color: var(--ft-linha);
	opacity: 1;
}

/* --------------------------------------------------------------------------
   3. Topo (barra de navegação)
   -------------------------------------------------------------------------- */
header .navbar {
	background-color: var(--ft-vidro);
	-webkit-backdrop-filter: blur(14px) saturate(1.25);
	backdrop-filter: blur(14px) saturate(1.25);
	border-bottom: 1px solid var(--ft-linha) !important;
	box-shadow: 0 10px 34px -22px rgba(0, 0, 0, .75);
}

header .navbar::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: -1px;
	height: 1px;
	pointer-events: none;
	background: linear-gradient(90deg, transparent 0%, var(--ft-acao) 22%, var(--ft-acento) 50%, var(--ft-acao) 78%, transparent 100%);
	opacity: calc(.45 + var(--ft-brilho) * .55);
	box-shadow: 0 0 calc(var(--ft-brilho) * 16px) var(--ft-acao);
}

header .navbar .nav-link,
header .navbar .navbar-text {
	font-weight: 600;
	letter-spacing: .03em;
}

header .navbar .nav-link:hover,
header .navbar .nav-link:focus {
	color: var(--ft-acento) !important;
	text-shadow: 0 0 calc(var(--ft-brilho) * 14px) color-mix(in srgb, var(--ft-acento) 70%, transparent);
}

header .navbar .navbar-toggler {
	border-color: var(--ft-linha-forte);
}

header .navbar .flag-icon {
	border-radius: 3px;
	box-shadow: 0 0 0 1px var(--ft-linha-forte);
}

/* Botão "Anunciar" do topo */
.btn-highlight,
header .navbar .btn-highlight {
	--ft-btn-fundo: linear-gradient(135deg, var(--ft-acento), color-mix(in srgb, var(--ft-acento) 55%, var(--ft-acao)));
	background: var(--ft-btn-fundo) !important;
	border: 0 !important;
	color: var(--ft-sobre-acento) !important;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: var(--ft-titulos-caixa);
	padding: .5rem 1.05rem;
	border-radius: var(--bs-border-radius-sm);
	clip-path: var(--ft-recorte);
	box-shadow: 0 0 calc(var(--ft-brilho) * 22px) color-mix(in srgb, var(--ft-acento) 45%, transparent);
	transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}

.btn-highlight:hover,
.btn-highlight:focus {
	filter: brightness(1.08);
	transform: translateY(-1px);
	color: var(--ft-sobre-acento) !important;
	box-shadow: 0 0 calc(var(--ft-brilho) * 34px) color-mix(in srgb, var(--ft-acento) 65%, transparent);
}

.dropdown-menu {
	--bs-dropdown-bg: var(--ft-painel);
	--bs-dropdown-border-color: var(--ft-linha-forte);
	--bs-dropdown-color: var(--ft-texto);
	--bs-dropdown-link-color: var(--ft-texto);
	--bs-dropdown-link-hover-color: var(--ft-forte);
	--bs-dropdown-link-hover-bg: color-mix(in srgb, var(--ft-acao) 16%, transparent);
	--bs-dropdown-link-active-color: var(--ft-sobre-acao);
	--bs-dropdown-link-active-bg: var(--ft-acao);
	--bs-dropdown-divider-bg: var(--ft-linha);
	--bs-dropdown-header-color: var(--ft-suave);
	box-shadow: 0 18px 44px -18px rgba(0, 0, 0, .75), 0 0 0 1px color-mix(in srgb, var(--ft-acao) 18%, transparent);
}

/* --------------------------------------------------------------------------
   4. Botões
   -------------------------------------------------------------------------- */
.btn {
	font-weight: 600;
	letter-spacing: .03em;
	transition: color .18s ease, background-color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease, filter .18s ease;
}

.btn-primary {
	background-image: linear-gradient(135deg, var(--ft-acao), var(--ft-botao-fim)) !important;
	border-color: transparent !important;
	color: var(--ft-sobre-acao) !important;
	box-shadow: 0 0 calc(var(--ft-brilho) * 18px) color-mix(in srgb, var(--ft-acao) 40%, transparent);
	clip-path: var(--ft-recorte);
}

.btn-primary:hover,
.btn-primary:focus-visible,
.btn-primary:active {
	filter: brightness(1.1) saturate(1.1);
	color: var(--ft-sobre-acao) !important;
	box-shadow: 0 0 calc(var(--ft-brilho) * 30px) color-mix(in srgb, var(--ft-acao) 60%, transparent);
}

.btn-secondary {
	background-color: var(--ft-painel-2) !important;
	border-color: var(--ft-linha-forte) !important;
	color: var(--ft-forte) !important;
}

.btn-secondary:hover {
	border-color: var(--ft-acao) !important;
	color: var(--ft-forte) !important;
	box-shadow: 0 0 0 1px color-mix(in srgb, var(--ft-acao) 35%, transparent);
}

.btn-outline-primary {
	--bs-btn-color: var(--ft-acao-texto);
	--bs-btn-border-color: color-mix(in srgb, var(--ft-acao) 70%, transparent);
	--bs-btn-hover-color: var(--ft-sobre-acao);
	--bs-btn-hover-bg: var(--ft-acao);
	--bs-btn-hover-border-color: var(--ft-acao);
}

.btn-outline-secondary {
	--bs-btn-color: var(--ft-suave);
	--bs-btn-border-color: var(--ft-linha-forte);
	--bs-btn-hover-color: var(--ft-forte);
	--bs-btn-hover-bg: color-mix(in srgb, var(--ft-acao) 14%, transparent);
	--bs-btn-hover-border-color: var(--ft-acao);
	--bs-btn-active-color: var(--ft-forte);
	--bs-btn-active-bg: color-mix(in srgb, var(--ft-acao) 22%, transparent);
	--bs-btn-active-border-color: var(--ft-acao);
}

.btn-outline-secondary:hover {
	box-shadow: 0 0 calc(var(--ft-brilho) * 14px) color-mix(in srgb, var(--ft-acao) 40%, transparent);
}

.btn-close {
	filter: var(--ft-filtro-fechar);
}

/* --------------------------------------------------------------------------
   5. Painéis (cards) com cantos de HUD
   -------------------------------------------------------------------------- */
.card {
	--bs-card-bg: var(--ft-painel);
	--bs-card-border-color: var(--ft-linha);
	--bs-card-cap-bg: transparent;
	--bs-card-cap-color: var(--ft-forte);
	--bs-card-color: var(--ft-texto);
	box-shadow: var(--ft-sombra);
}

.card::before,
.card::after,
.items-details-wrapper::before,
.items-details-wrapper::after {
	content: '';
	position: absolute;
	width: 14px;
	height: 14px;
	pointer-events: none;
	opacity: calc(.35 + var(--ft-brilho) * .65);
}

.card::before,
.items-details-wrapper::before {
	top: -1px;
	left: -1px;
	border-top: 2px solid var(--ft-acao);
	border-left: 2px solid var(--ft-acao);
	border-top-left-radius: var(--bs-card-border-radius, var(--bs-border-radius));
}

.card::after,
.items-details-wrapper::after {
	right: -1px;
	bottom: -1px;
	border-right: 2px solid var(--ft-acento);
	border-bottom: 2px solid var(--ft-acento);
	border-bottom-right-radius: var(--bs-card-border-radius, var(--bs-border-radius));
}

.items-details-wrapper {
	position: relative;
	background-color: var(--ft-painel) !important;
	box-shadow: var(--ft-sombra);
}

.card-header {
	border-bottom: 1px solid var(--ft-linha) !important;
	padding-top: .85rem;
	padding-bottom: .85rem;
}

.card-header h4,
.card-header .h4 {
	font-family: var(--theme-heading-font, inherit);
	text-transform: var(--ft-titulos-caixa);
	letter-spacing: var(--ft-titulos-espaco);
	font-size: 1.15rem;
	color: var(--ft-forte);
}

.card-header h4 .fw-bold,
.card-header h4 strong {
	color: var(--ft-acao-texto);
	text-shadow: 0 0 calc(var(--ft-brilho) * 16px) color-mix(in srgb, var(--ft-acao) 55%, transparent);
}

.card-header h5 a {
	font-family: var(--ft-mono);
	letter-spacing: .08em;
}

/* Fundos utilitários usados nas telas */
.bg-body-tertiary {
	background-color: var(--ft-painel) !important;
}

.bg-body-secondary {
	background-color: var(--ft-painel-2) !important;
}

.hover-bg-tertiary:hover {
	background-color: var(--ft-painel-2) !important;
}

.hover-shadow:hover {
	box-shadow: 0 0 0 1px color-mix(in srgb, var(--ft-acao) 45%, transparent), 0 14px 34px -16px color-mix(in srgb, var(--ft-acao) calc(var(--ft-brilho) * 80%), transparent);
}

.border,
.border-top,
.border-bottom,
.border-start,
.border-end {
	border-color: var(--ft-linha) !important;
}

.text-secondary {
	color: var(--ft-suave) !important;
}

.text-primary {
	color: var(--ft-acao-texto) !important;
}

/* --------------------------------------------------------------------------
   6. Capa da página inicial (busca)
   -------------------------------------------------------------------------- */
/* Fundo da capa: vence o cinza do Default (.bg-secondary) e perde para o fundo
   escolhido em Admin > Página inicial > Busca (seletor mais forte). */
#homepage .hero-wrap {
	background-color: var(--ft-fundo) !important;
	background-image: var(--ft-capa-fundo) !important;
}

#homepage .hero-wrap:not(.only-search-bar) {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	border-bottom: 1px solid var(--ft-linha);
}

#homepage .hero-wrap:not(.only-search-bar)::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background-image:
		radial-gradient(60% 70% at 50% 110%, color-mix(in srgb, var(--ft-acao) calc(var(--ft-brilho) * 55%), transparent), transparent 70%),
		radial-gradient(40% 50% at 85% 10%, color-mix(in srgb, var(--ft-acento) calc(var(--ft-brilho) * 30%), transparent), transparent 70%),
		linear-gradient(var(--ft-grade-capa) 1px, transparent 1px),
		linear-gradient(90deg, var(--ft-grade-capa) 1px, transparent 1px),
		repeating-linear-gradient(0deg, rgba(255, 255, 255, var(--ft-linhas-tela)) 0 1px, transparent 1px 4px);
	background-size: auto, auto, 44px 44px, 44px 44px, auto;
	-webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, .95), rgba(0, 0, 0, .55));
	mask-image: linear-gradient(180deg, rgba(0, 0, 0, .95), rgba(0, 0, 0, .55));
}

#homepage .hero-wrap:not(.only-search-bar)::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 2px;
	z-index: 0;
	pointer-events: none;
	background: linear-gradient(90deg, transparent, var(--ft-acao), var(--ft-acento), var(--ft-acao), transparent);
	box-shadow: 0 0 calc(var(--ft-brilho) * 24px) var(--ft-acao);
}

#homepage .hero-wrap h1 {
	font-family: var(--theme-heading-font, inherit);
	font-size: clamp(1.9rem, 4.2vw, 3.3rem);
	letter-spacing: var(--ft-capa-espaco);
	color: var(--ft-capa-titulo) !important;
	text-shadow: var(--ft-capa-sombra);
}

#homepage .hero-wrap h5 {
	color: var(--ft-capa-subtitulo) !important;
	font-weight: 400;
	letter-spacing: .08em;
	text-shadow: none;
	opacity: .95;
}

/* Barra de busca (início) */
.search-row .search-col > div {
	background-color: var(--ft-vidro-forte) !important;
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	border-color: color-mix(in srgb, var(--ft-acao) 80%, transparent) !important;
	box-shadow: inset 0 0 18px -10px color-mix(in srgb, var(--ft-acao) 80%, transparent);
}

.search-row .search-col > div .form-control {
	background: transparent;
	color: var(--ft-forte);
}

.search-row .search-col > div i {
	color: var(--ft-acento) !important;
}

.search-row .search-col button.btn-primary {
	border-color: color-mix(in srgb, var(--ft-acao) 80%, transparent) !important;
	clip-path: none;
}

/* Barra de busca das outras páginas */
#searchForm .bg-primary.rounded {
	background-image: linear-gradient(90deg, color-mix(in srgb, var(--ft-acao) 85%, var(--ft-fundo)), color-mix(in srgb, var(--ft-acento) 55%, var(--ft-acao))) !important;
	box-shadow: 0 0 calc(var(--ft-brilho) * 26px) color-mix(in srgb, var(--ft-acao) 40%, transparent);
	padding: 3px !important;
}

#searchForm .bg-primary.rounded .btn-primary {
	background-image: none !important;
	background-color: color-mix(in srgb, var(--ft-fundo) 30%, transparent) !important;
	color: #fff !important;
	clip-path: none;
	box-shadow: none;
}

/* --------------------------------------------------------------------------
   7. Formulários
   -------------------------------------------------------------------------- */
.form-control,
.form-select {
	background-color: var(--ft-painel-2);
	border-color: var(--ft-linha-forte);
	color: var(--ft-forte);
}

.form-control::placeholder {
	color: var(--ft-suave);
	opacity: .85;
}

.form-control:focus,
.form-select:focus {
	background-color: var(--ft-painel-2);
	border-color: var(--ft-acao);
	color: var(--ft-forte);
	box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--ft-acao) 28%, transparent), 0 0 calc(var(--ft-brilho) * 20px) color-mix(in srgb, var(--ft-acao) 35%, transparent);
}

.form-control:disabled,
.form-select:disabled,
.form-control[readonly] {
	background-color: var(--ft-painel);
	color: var(--ft-suave);
}

.input-group-text {
	background-color: var(--ft-painel);
	border-color: var(--ft-linha-forte);
	color: var(--ft-suave);
}

.form-check-input {
	background-color: var(--ft-painel-2);
	border-color: var(--ft-linha-forte);
}

.form-check-input:checked {
	background-color: var(--ft-acao);
	border-color: var(--ft-acao);
	box-shadow: 0 0 calc(var(--ft-brilho) * 12px) color-mix(in srgb, var(--ft-acao) 55%, transparent);
}

.form-label,
label {
	color: var(--ft-forte);
}

/* Select2 (listas de categoria, cidade etc.) */
.select2-container--bootstrap-5 .select2-selection {
	background-color: var(--ft-painel-2) !important;
	border-color: var(--ft-linha-forte) !important;
	color: var(--ft-forte) !important;
}

.select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered {
	color: var(--ft-forte) !important;
}

.select2-container--bootstrap-5 .select2-dropdown {
	background-color: var(--ft-painel) !important;
	border-color: var(--ft-acao) !important;
	color: var(--ft-texto);
}

.select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option.select2-results__option--highlighted {
	background-color: color-mix(in srgb, var(--ft-acao) 22%, transparent) !important;
	color: var(--ft-forte) !important;
}

.select2-container--bootstrap-5 .select2-dropdown .select2-search .select2-search__field {
	background-color: var(--ft-painel-2);
	border-color: var(--ft-linha-forte);
	color: var(--ft-forte);
}

/* --------------------------------------------------------------------------
   8. Categorias da página inicial
   -------------------------------------------------------------------------- */
.big-icon-category-list > .col > div {
	background-color: var(--ft-painel-2);
	border-color: var(--ft-linha) !important;
	transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

.big-icon-category-list > .col > div:hover {
	transform: translateY(-3px);
	border-color: color-mix(in srgb, var(--ft-acao) 75%, transparent) !important;
	background-color: color-mix(in srgb, var(--ft-acao) 9%, var(--ft-painel-2));
	box-shadow: 0 0 0 1px color-mix(in srgb, var(--ft-acao) 30%, transparent), 0 16px 34px -18px color-mix(in srgb, var(--ft-acao) calc(var(--ft-brilho) * 90%), transparent);
}

html .big-icon-category-list a {
	color: var(--ft-forte) !important;
	font-weight: 600;
	letter-spacing: .02em;
}

.big-icon-category-list a i,
.big-icon-category-list a .fa-solid,
.big-icon-category-list a .bi {
	color: var(--ft-acao);
	text-shadow: 0 0 calc(var(--ft-brilho) * 18px) color-mix(in srgb, var(--ft-acao) 70%, transparent);
	transition: color .2s ease, text-shadow .2s ease;
}

.big-icon-category-list > .col > div:hover a i,
.big-icon-category-list > .col > div:hover a .fa-solid {
	color: var(--ft-acento);
	text-shadow: 0 0 calc(var(--ft-brilho) * 24px) color-mix(in srgb, var(--ft-acento) 80%, transparent);
}

/* --------------------------------------------------------------------------
   9. Anúncios em grade, lista e carrossel
   -------------------------------------------------------------------------- */
.item-list > div {
	background-color: var(--ft-painel-2);
	border-color: var(--ft-linha) !important;
	transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.item-list > div:hover {
	transform: translateY(-3px);
	border-color: color-mix(in srgb, var(--ft-acao) 70%, transparent) !important;
}

.item-list .main-image img,
.featured-list-slider .item-carousel-thumb img,
.item-list img.img-fluid {
	border-radius: calc(var(--ft-raio) * .7);
	filter: saturate(1.05) contrast(1.02);
}

.item-list h5.fs-5,
.item-list h5.fs-5 a {
	color: var(--ft-forte);
	font-weight: 600;
	letter-spacing: .01em;
}

.item-list h5.fs-5,
.item.card h6.fs-5 {
	font-family: var(--ft-fonte-anuncio);
}

.item-list h5.fs-5 a:hover {
	color: var(--ft-acento);
}

.item-list h5.fs-4,
.featured-list-slider .price,
.item-list .price,
.items-details .price {
	font-family: var(--ft-mono);
	color: var(--ft-preco);
	letter-spacing: .02em;
	text-shadow: 0 0 calc(var(--ft-brilho) * 14px) color-mix(in srgb, var(--ft-preco) 45%, transparent);
}

.item-list .make-favorite {
	border-radius: var(--bs-border-radius-sm);
}

.item-list .bg-body-secondary.opacity-75 {
	background-color: color-mix(in srgb, var(--ft-fundo) 75%, transparent) !important;
	color: var(--ft-forte);
	opacity: 1 !important;
	border: 1px solid var(--ft-linha);
	font-family: var(--ft-mono);
	font-size: .8rem;
}

.featured-list-slider .item {
	background-color: var(--ft-painel-2);
	border-color: var(--ft-linha) !important;
}

/* Carrosséis (destaques, anúncios parecidos): preço no mesmo estilo da grade */
.item.card .card-body h4.fs-4 {
	font-family: var(--ft-mono);
	color: var(--ft-preco);
	letter-spacing: .02em;
	text-shadow: 0 0 calc(var(--ft-brilho) * 14px) color-mix(in srgb, var(--ft-preco) 45%, transparent);
}

/* --------------------------------------------------------------------------
   10. Página do anúncio
   -------------------------------------------------------------------------- */
.p-price-tag {
	background: linear-gradient(135deg, var(--ft-acao), var(--ft-botao-fim));
	color: var(--ft-sobre-acao);
	font-family: var(--ft-mono);
	letter-spacing: .03em;
	box-shadow: 0 0 calc(var(--ft-brilho) * 26px) color-mix(in srgb, var(--ft-acao) 55%, transparent);
}

.p-price-tag:before {
	border-top-color: color-mix(in srgb, var(--ft-acao) 60%, #000);
}

.gallery-container .main-gallery {
	background-color: var(--ft-painel-2);
	border: 1px solid var(--ft-linha);
	border-radius: var(--ft-raio);
}

.thumbs-gallery .swiper-slide {
	border-radius: calc(var(--ft-raio) * .6);
	overflow: hidden;
	border: 1px solid var(--ft-linha);
}

.thumbs-gallery .swiper-slide.swiper-slide-thumb-active {
	border-color: var(--ft-acao) !important;
	box-shadow: 0 0 calc(var(--ft-brilho) * 16px) color-mix(in srgb, var(--ft-acao) 60%, transparent);
}

.swiper-button-next,
.swiper-button-prev {
	color: var(--ft-acento) !important;
	text-shadow: 0 0 calc(var(--ft-brilho) * 12px) var(--ft-acento);
}

.items-details-wrapper h1,
.items-details-wrapper h1 a {
	font-family: var(--ft-fonte-anuncio);
	letter-spacing: .01em;
}

/* Ícone do X (preto) some no escuro */
[data-bs-theme="dark"] .social-share .x-twitter,
[data-bs-theme="dark"] .social-share .x-twitter i {
	color: var(--ft-forte) !important;
}

.from-wysiwyg {
	color: var(--ft-texto);
	line-height: 1.7;
}

.badge.bg-primary,
.text-bg-primary {
	background-color: var(--ft-acao) !important;
	color: var(--ft-sobre-acao) !important;
}

/* "Informação" (ex.: Negociável) na cor de destaque do tema */
.text-bg-info,
.badge.bg-info {
	background-color: var(--ft-acento) !important;
	color: var(--ft-sobre-acento) !important;
}

/* --------------------------------------------------------------------------
   11. Abas, listas, tabelas, paginação, trilha
   -------------------------------------------------------------------------- */
.nav-tabs {
	--bs-nav-tabs-border-color: var(--ft-linha);
	--bs-nav-tabs-link-hover-border-color: var(--ft-linha) var(--ft-linha) var(--ft-linha);
	--bs-nav-tabs-link-active-color: var(--ft-forte);
	--bs-nav-tabs-link-active-bg: var(--ft-painel);
	--bs-nav-tabs-link-active-border-color: var(--ft-linha) var(--ft-linha) var(--ft-painel);
}

.nav-tabs .nav-link.active {
	box-shadow: inset 0 2px 0 var(--ft-acao);
}

.nav-pills {
	--bs-nav-pills-link-active-bg: var(--ft-acao);
	--bs-nav-pills-link-active-color: var(--ft-sobre-acao);
}

.list-group {
	--bs-list-group-bg: var(--ft-painel);
	--bs-list-group-color: var(--ft-texto);
	--bs-list-group-border-color: var(--ft-linha);
	--bs-list-group-action-hover-bg: color-mix(in srgb, var(--ft-acao) 12%, transparent);
	--bs-list-group-action-hover-color: var(--ft-forte);
	--bs-list-group-active-bg: var(--ft-acao);
	--bs-list-group-active-border-color: var(--ft-acao);
	--bs-list-group-active-color: var(--ft-sobre-acao);
}

.table {
	--bs-table-bg: transparent;
	--bs-table-color: var(--ft-texto);
	--bs-table-border-color: var(--ft-linha);
	--bs-table-striped-bg: color-mix(in srgb, var(--ft-acao) 5%, transparent);
	--bs-table-striped-color: var(--ft-texto);
	--bs-table-hover-bg: color-mix(in srgb, var(--ft-acao) 9%, transparent);
	--bs-table-hover-color: var(--ft-forte);
}

.pagination {
	--bs-pagination-bg: var(--ft-painel);
	--bs-pagination-border-color: var(--ft-linha);
	--bs-pagination-color: var(--ft-texto);
	--bs-pagination-hover-bg: color-mix(in srgb, var(--ft-acao) 14%, var(--ft-painel));
	--bs-pagination-hover-color: var(--ft-forte);
	--bs-pagination-hover-border-color: var(--ft-acao);
	--bs-pagination-active-bg: var(--ft-acao);
	--bs-pagination-active-border-color: var(--ft-acao);
	--bs-pagination-active-color: var(--ft-sobre-acao);
	--bs-pagination-disabled-bg: var(--ft-painel);
	--bs-pagination-disabled-color: var(--ft-suave);
	--bs-pagination-disabled-border-color: var(--ft-linha);
	font-family: var(--ft-mono);
}

.breadcrumb {
	--bs-breadcrumb-divider-color: var(--ft-suave);
	--bs-breadcrumb-item-active-color: var(--ft-suave);
	font-size: .88rem;
	letter-spacing: .02em;
}

.modal {
	--bs-modal-bg: var(--ft-painel);
	--bs-modal-color: var(--ft-texto);
	--bs-modal-border-color: var(--ft-linha-forte);
	--bs-modal-header-border-color: var(--ft-linha);
	--bs-modal-footer-border-color: var(--ft-linha);
}

.modal-content {
	box-shadow: 0 30px 80px -30px rgba(0, 0, 0, .85), 0 0 0 1px color-mix(in srgb, var(--ft-acao) 25%, transparent);
}

.offcanvas {
	--bs-offcanvas-bg: var(--ft-painel);
	--bs-offcanvas-color: var(--ft-texto);
	--bs-offcanvas-border-color: var(--ft-linha);
}

.accordion {
	--bs-accordion-bg: var(--ft-painel);
	--bs-accordion-color: var(--ft-texto);
	--bs-accordion-border-color: var(--ft-linha);
	--bs-accordion-active-bg: color-mix(in srgb, var(--ft-acao) 14%, var(--ft-painel));
	--bs-accordion-active-color: var(--ft-forte);
	--bs-accordion-btn-color: var(--ft-forte);
	--bs-accordion-btn-bg: var(--ft-painel);
}

/* --------------------------------------------------------------------------
   12. Seções da página inicial (cidades, números)
   -------------------------------------------------------------------------- */
.location-card .card a {
	color: var(--ft-texto) !important;
	transition: color .18s ease, padding-left .18s ease;
}

.location-card .card a:hover {
	color: var(--ft-acento) !important;
	padding-left: 3px;
}

.page-section--stats .card .counter,
.page-section--stats .card .fs-1,
.page-section--stats .card h2 {
	font-family: var(--ft-mono);
	color: var(--ft-forte);
	text-shadow: 0 0 calc(var(--ft-brilho) * 22px) color-mix(in srgb, var(--ft-acao) 65%, transparent);
}

.page-section--stats .card i,
.page-section--stats .card .bi {
	color: var(--ft-acao);
	text-shadow: 0 0 calc(var(--ft-brilho) * 18px) color-mix(in srgb, var(--ft-acao) 70%, transparent);
}

/* --------------------------------------------------------------------------
   13. Rodapé
   -------------------------------------------------------------------------- */
footer > .container-fluid {
	position: relative;
	background-color: var(--ft-rodape) !important;
	background-image:
		radial-gradient(900px 300px at 50% 0%, color-mix(in srgb, var(--ft-acao) calc(var(--ft-brilho) * 18%), transparent), transparent 70%),
		linear-gradient(var(--ft-grade) 1px, transparent 1px),
		linear-gradient(90deg, var(--ft-grade) 1px, transparent 1px);
	background-size: auto, var(--ft-grade-tamanho) var(--ft-grade-tamanho), var(--ft-grade-tamanho) var(--ft-grade-tamanho);
	border-top: 0 !important;
	color: var(--ft-suave);
}

footer > .container-fluid::before {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--ft-acao), var(--ft-acento), var(--ft-acao), transparent);
	box-shadow: 0 0 calc(var(--ft-brilho) * 18px) var(--ft-acao);
}

footer .menu-type-title,
footer h4 {
	color: var(--ft-forte) !important;
	font-family: var(--theme-heading-font, inherit);
	letter-spacing: var(--ft-titulos-espaco);
}

footer a {
	color: var(--ft-suave) !important;
}

footer a:hover {
	color: var(--ft-acento) !important;
	text-shadow: 0 0 calc(var(--ft-brilho) * 12px) color-mix(in srgb, var(--ft-acento) 60%, transparent);
}

footer .border-top {
	border-color: var(--ft-linha) !important;
}

/* --------------------------------------------------------------------------
   14. Login e cadastro
   -------------------------------------------------------------------------- */
.auth-login-register .hero-wrap {
	position: relative;
	overflow: hidden;
}

.auth-login-register .hero-mask {
	background: linear-gradient(160deg, color-mix(in srgb, var(--ft-fundo) 80%, var(--ft-acao)), color-mix(in srgb, var(--ft-acao) 70%, var(--ft-fundo))) !important;
	opacity: .92 !important;
}

.auth-login-register .hero-wrap::after {
	content: '';
	position: absolute;
	inset: 0;
	pointer-events: none;
	background-image:
		linear-gradient(var(--ft-grade-capa) 1px, transparent 1px),
		linear-gradient(90deg, var(--ft-grade-capa) 1px, transparent 1px),
		repeating-linear-gradient(0deg, rgba(255, 255, 255, var(--ft-linhas-tela)) 0 1px, transparent 1px 4px);
	background-size: 44px 44px, 44px 44px, auto;
}

.auth-login-register .hero-content {
	position: relative;
	z-index: 1;
}

#main-wrapper.auth-login-register {
	background-color: var(--ft-fundo);
}

/* --------------------------------------------------------------------------
   15. Avisos, cookies, alertas, barra de progresso
   -------------------------------------------------------------------------- */
.cookie-consent {
	background-color: var(--ft-painel) !important;
	color: var(--ft-texto) !important;
	border-top: 1px solid var(--ft-acao);
	box-shadow: 0 -10px 40px -20px color-mix(in srgb, var(--ft-acao) 60%, transparent);
}

.cookie-consent__agree {
	background-color: var(--ft-acao) !important;
	color: var(--ft-sobre-acao) !important;
}

.pace .pace-progress {
	background: linear-gradient(90deg, var(--ft-acao), var(--ft-acento)) !important;
	box-shadow: 0 0 10px var(--ft-acento);
}

.swal2-popup {
	background: var(--ft-painel) !important;
	color: var(--ft-texto) !important;
	border: 1px solid var(--ft-linha-forte);
}

.swal2-title,
.swal2-html-container {
	color: var(--ft-forte) !important;
}

.alert {
	border-left-width: 3px;
}

/* --------------------------------------------------------------------------
   16. Movimento: quem pede menos movimento não vê animação
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .001ms !important;
	}
}

@media (max-width: 767.98px) {
	body::before {
		background-size: auto, auto, calc(var(--ft-grade-tamanho) * .75) calc(var(--ft-grade-tamanho) * .75), calc(var(--ft-grade-tamanho) * .75) calc(var(--ft-grade-tamanho) * .75);
	}

	.item-list > div:hover,
	.big-icon-category-list > .col > div:hover {
		transform: none;
	}
}

/* ==========================================================================
   Só deste tema: Âmbar
   ========================================================================== */
/* Capa: colmeia dourada no lugar da grade quadrada */
#homepage .hero-wrap:not(.only-search-bar)::before {
	background-image:
		radial-gradient(60% 70% at 50% 110%, color-mix(in srgb, var(--ft-acao) calc(var(--ft-brilho) * 50%), transparent), transparent 70%),
		radial-gradient(40% 50% at 85% 10%, color-mix(in srgb, var(--ft-acento) calc(var(--ft-brilho) * 24%), transparent), transparent 70%),
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='31.18' height='54' viewBox='0 0 31.18 54'%3E%3Cpath d='M15.59 0 31.18 9v18L15.59 36 0 27V9zM15.59 36v18' fill='none' stroke='%23f2a900' stroke-opacity='.16' stroke-width='1'/%3E%3C/svg%3E"),
		repeating-linear-gradient(0deg, rgba(255, 255, 255, var(--ft-linhas-tela)) 0 1px, transparent 1px 4px);
	background-size: auto, auto, 31.18px 54px, auto;
}

/* Topo, botões e títulos de seção no estilo de interface de implante */
header .navbar .nav-link,
.btn,
.card-header h4,
.card-header .h4,
.breadcrumb {
	font-family: var(--theme-heading-font, inherit);
	text-transform: uppercase;
	letter-spacing: .08em;
}

.btn {
	font-weight: 700;
}

/* Faixa de aviso em diagonal sob o topo */
header .navbar::after {
	height: 3px;
	bottom: -3px;
	background: repeating-linear-gradient(-45deg, var(--ft-acao) 0 10px, transparent 10px 20px);
	opacity: .55;
	box-shadow: none;
}

/* Etiqueta de preço com canto cortado */
.p-price-tag {
	clip-path: var(--ft-recorte);
}

/* Cantos de HUD mais longos */
.card::before,
.card::after,
.items-details-wrapper::before,
.items-details-wrapper::after {
	width: 22px;
	height: 22px;
}