/* PortalAuto — complementos ao CSS do template (assets/css/app.css, compilado de portal_template/public/assets/scss) */

:root {
    --font-manrope: 'Manrope';
    --font-albert-sans: 'Albert Sans';
    --pa-verde: #98BC2A;
    --pa-escuro: #1C1C1C;
    --pa-cinza: #9FA1A4;
    --pa-linha: #E7E7E7;
}

/* Utilitárias que o template não tinha */
.grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.justify-start { justify-content: flex-start; }
.mt-12 { margin-top: 12px; }
.mt-14 { margin-top: 14px; }
.mt-24 { margin-top: 24px; }
.p-10 { padding: 10px; }
body.modal-aberto { overflow: hidden; }
.campo-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* Animações (substituto do WOW.js): só escondidas quando há JavaScript */
html.js .wow { visibility: hidden; }
html.js .wow.wow-visivel { visibility: visible; }

/* Fotos reais com proporções diferentes: recortar como no template */
.card-box .card--img { width: 100%; aspect-ratio: 410 / 280; object-fit: cover; }

/* Cartões de viatura com a mesma altura (grelhas e sliders); botões sempre no fundo */
.card-box-style-1 { display: flex; flex-direction: column; height: auto; flex: 1 1 auto; }
.card-box-style-1 .content { flex: 1 1 auto; display: flex; flex-direction: column; }
.card-box-style-1 .content > .card-box__price { margin-top: auto; }
.swiper-slide:has(.card-box-style-1), .swiper-slide > div:has(> .card-box-style-1) { display: flex; flex-direction: column; height: auto !important; } /* o Swiper em grelha mete height inline nos slides */
.swiper-slide > div:has(> .card-box-style-1) { flex: 1 1 auto; }
/* Cartões escuros (cardViaturaEscuro): mesma altura no carrossel, preço e botões alinhados em baixo */
.swiper-slide:has(> .card-box-style-2) { display: flex; flex-direction: column; height: auto !important; }
.card-box-style-2 { display: flex; flex-direction: column; flex: 1 1 auto; }
.card-box-style-2 .content { flex: 1 1 auto; display: flex; flex-direction: column; }
.card-box-style-2 .content > .card-box__price { margin-top: auto; }
.listing-details-item img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; cursor: zoom-in; }
.car-box-style-3 .card--img { object-fit: cover; }
.post--img { width: 100%; aspect-ratio: 410 / 280; object-fit: cover; }
.recent-post .post--img { aspect-ratio: 3 / 2; }
.dealer-box .image { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 12px; background: #fff; }
.imagem-stand { width: 300px; max-width: 100%; aspect-ratio: 3 / 2; object-fit: contain; background: #fff; border: 1px solid var(--pa-linha); }
.imagem-galeria-stand { aspect-ratio: 3 / 2; object-fit: cover; }
.logo-stand { object-fit: contain; background: #fff; border-radius: 50%; }
.card-details--table .image { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.header .logo img, .logo-mobile img { height: auto; }

/* Logótipos das marcas */
.out-brand .logo-marca { object-fit: contain; padding: 22px; background: #fff; }
.logo-marca-texto { display: flex; align-items: center; justify-content: center; width: 80px; height: 80px; max-width: 100%; margin: 0 auto 8px; border-radius: 50%; background: #fff; font-size: 40px; font-weight: 800; color: var(--pa-verde); text-transform: uppercase; }

/* Slider de intervalo (preço / ano), mesmo aspeto do #slider-range do template */
.pa-range { padding: 8px 8px 0; }
.pa-range__pista { position: relative; height: 4px; border-radius: 3px; background: var(--pa-linha); cursor: pointer; touch-action: none; }
.pa-range__intervalo { position: absolute; top: 0; height: 4px; border-radius: 3px; background: var(--pa-verde); }
.pa-range__pega { position: absolute; top: -6px; width: 16px; height: 16px; margin-left: -8px; border-radius: 50%; background: #fff; border: 3px solid var(--pa-verde); cursor: grab; z-index: 3; outline: none; touch-action: none; }
.pa-range__pega:focus-visible { box-shadow: 0 0 0 4px rgba(152, 188, 42, .3); }
.pa-range .filter-price-range-label { display: flex; justify-content: space-between; gap: 8px; }
.pa-range [data-mostra] { white-space: nowrap; }
/* Painel "mais filtros" da home: o wrapper do template era a própria pista (4px, fundo cinza) */
.search-cars__range { grid-column: span 1; max-width: none; }
.search-cars__range-label { margin-bottom: 4px; font-size: 12px; color: #555; }
.search-cars__range-wrapper { height: auto; background: none; border-radius: 0; }
.search-cars__advanced .pa-range { padding: 8px 8px 0; }
.search-cars__advanced .pa-range .filter-price-range-label { margin-top: 8px; }

/* Dropdowns com pesquisa */
.filter-select-dropdown__list { max-height: 280px; overflow-y: auto; }

/* Dropdowns de escolha única: sem caixa de seleção, a opção escolhida fica destacada */
.filter-select-dropdown[data-unico] .filter-checkbox span { padding-left: 0; }
.filter-select-dropdown[data-unico] .filter-checkbox span::before { display: none; }
.filter-select-dropdown[data-unico] .filter-checkbox:hover span { color: var(--pa-verde); }
.filter-select-dropdown[data-unico] .filter-checkbox input:checked + span { color: var(--pa-verde); font-weight: 600; }

/* Comparar: botão já escolhido */
.compare-details.ativo-comparar, .btn.ativo-comparar { color: var(--pa-verde); border-color: var(--pa-verde); }
.btn-icon-circle.active svg path { fill: #E5484D; stroke: #E5484D; }
.heart.active svg path { fill: #E5484D; stroke: #E5484D; }
.botao-remover-comparar { position: absolute; top: 0; right: 0; background: transparent; border: 0; cursor: pointer; padding: 8px; z-index: 10; }
/* Na tabela de comparação o template estica todas as img do .top (230px/100%) — repor o ícone */
.card-details .card-details--table tr:first-child .top .botao-remover-comparar { top: 10px; right: 10px; width: 32px; height: 32px; padding: 0; display: flex; align-items: center; justify-content: center; border-radius: 50%; box-shadow: 0 2px 6px rgba(0,0,0,.15); transition: transform .2s ease; }
.card-details .card-details--table tr:first-child .top .botao-remover-comparar:hover { transform: scale(1.1); }
.card-details .card-details--table tr:first-child .top .botao-remover-comparar img { width: 32px; height: 32px; margin: 0; border-radius: 50%; object-fit: contain; }

/* Avisos */
.aviso-portal { margin: 16px 0; padding: 14px 18px; border-radius: 12px; font-weight: 500; }
.aviso-sucesso { background: #F3F7EE; color: #50611D; }
.aviso-erro { background: #FDECEC; color: #B42318; }
.aviso-flutuante { position: fixed; left: 50%; bottom: 24px; z-index: 2000; transform: translate(-50%, 20px); opacity: 0; pointer-events: none; padding: 12px 20px; border-radius: 100px; background: var(--pa-escuro); color: #fff; font-size: 14px; transition: all .3s ease; }
.aviso-flutuante.visivel { opacity: 1; transform: translate(-50%, 0); }
.form-resposta:empty { display: none; }
.resposta-ok { color: #50611D; }
.resposta-erro { color: #B42318; }
.footer .resposta-ok, .footer .resposta-erro { color: #fff; }

/* Sem resultados */
.sem-resultados { padding: 60px 20px; border: 1px dashed var(--pa-linha); border-radius: 16px; background: #F7F7F7; }

/* Zonas de conteúdos geridos na app */
.zona-conteudos { display: flex; flex-direction: column; gap: 20px; }
.zona-banner img { display: block; width: 100%; height: auto; }
.zona-entre-resultados { grid-column: 1 / -1; }
.zona-entre-resultados:empty { display: none; }

/* Texto vindo do editor (descrição da viatura, notícias, páginas) */
.conteudo-html p { margin-bottom: 14px; }
.conteudo-html ul, .conteudo-html ol { margin: 0 0 14px 20px; }
.conteudo-html ul { list-style: disc; }
.conteudo-html ol { list-style: decimal; }
.conteudo-html li { margin-bottom: 4px; list-style: inherit; display: list-item; }
.conteudo-html h2, .conteudo-html h3, .conteudo-html h4 { color: var(--pa-escuro); margin: 24px 0 12px; }
.conteudo-html img { max-width: 100%; height: auto; border-radius: 12px; }
.conteudo-html a { color: var(--pa-verde); text-decoration: underline; }
.conteudo-html blockquote { border-left: 3px solid var(--pa-verde); padding-left: 16px; margin: 20px 0; }

/* Ficha da viatura */
.lista-caracteristicas li { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--pa-linha); }
.lista-caracteristicas li span:last-child { text-align: right; }
.lista-condicoes li { position: relative; padding-left: 18px; margin-bottom: 4px; }
.lista-condicoes li::before { content: ''; position: absolute; left: 0; top: 9px; width: 8px; height: 8px; border-radius: 50%; background: var(--pa-verde); }
.video-viatura { position: relative; aspect-ratio: 16 / 9; }
.video-viatura iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
[data-telefone].revelado { font-weight: 600; }
.simulador-credito input, .simulador-credito select { width: 100%; }
/* Simulador desativado (PORTAL_CREDITO_ATIVO = false) */
.simulador-brevemente { position: relative; }
.simulador-brevemente--conteudo { opacity: .4; filter: grayscale(1); pointer-events: none; user-select: none; }
.simulador-brevemente--conteudo input, .simulador-brevemente--conteudo select, .simulador-brevemente--conteudo button { cursor: not-allowed; }
.simulador-brevemente--aviso { position: absolute; left: 50%; top: 55%; transform: translate(-50%, -50%); width: calc(100% - 32px); max-width: 360px; padding: 20px 24px; text-align: center; background: #fff; border-radius: 12px; box-shadow: 0 10px 30px rgba(0, 0, 0, .12); }
.simulador-brevemente--etiqueta { display: inline-block; padding: 6px 14px; border-radius: 999px; background: #1b1b1b; color: #fff; font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }

.listing-details-item--button { white-space: nowrap; }
.listing-details-item .listing-details-item--button img { flex-shrink: 0; width: 20px; height: 20px; }

/* Galeria em ecrã inteiro */
.galeria-fotos { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, .92); opacity: 0; visibility: hidden; transition: opacity .3s ease; }
.galeria-fotos.active { opacity: 1; visibility: visible; }
.galeria-fotos__imagem { max-width: 92vw; max-height: 86vh; object-fit: contain; user-select: none; }
.galeria-fotos__nav, .galeria-fotos__fechar { position: absolute; display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .12); cursor: pointer; }
.galeria-fotos__nav:hover, .galeria-fotos__fechar:hover { background: rgba(255, 255, 255, .25); }
.galeria-fotos__anterior { left: 20px; top: 50%; transform: translateY(-50%); }
.galeria-fotos__seguinte { right: 20px; top: 50%; transform: translateY(-50%); }
.galeria-fotos__fechar { top: 20px; right: 20px; }
.galeria-fotos__contador { position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); color: #fff; font-size: 14px; }

/* Perguntas frequentes: abrir / fechar com transição */
.acordeao-corpo { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .3s ease; }
.acordeao-corpo > div { overflow: hidden; }
.flat-toggle.active .acordeao-corpo { grid-template-rows: 1fr; }

/* Pesquisas (stands, notícias) */
.form-stands input, .form-stands select { min-width: 200px; }
.form-noticias { width: 100%; max-width: 360px; }

/* Rodapé: colunas abertas no telemóvel */
.footer .widget-links.aberto-movel { display: block !important; }

/* Pesquisar por tipo: total de viaturas em distintivo */
.brand-item__total { display: inline-flex; align-items: baseline; gap: 5px; margin-top: 10px; padding: 4px 12px; border-radius: 999px; background: rgba(28, 28, 28, .55); border: 1px solid rgba(255, 255, 255, .12); color: rgba(255, 255, 255, .75); font-size: 13px; font-weight: 500; line-height: 1.4; transition: all .3s ease; }
.brand-item__total strong { font-size: 16px; font-weight: 800; color: #fff; }
.brand-item:hover .brand-item__total { background: var(--pa-verde); border-color: var(--pa-verde); color: #fff; }

/* Menu móvel: submenus */
#main-nav-mobile .menu-item-inner-title.active svg { transform: rotate(180deg); }

@media (max-width: 767px) {
    .menu-tab-style2 .text { font-size: 24px; line-height: 32px; }
    .form-stands { flex-wrap: wrap; width: 100%; }
    .form-stands input, .form-stands select { min-width: 0; flex: 1 1 100%; }
    .galeria-fotos__nav { width: 40px; height: 40px; }
    .galeria-fotos__anterior { left: 8px; }
    .galeria-fotos__seguinte { right: 8px; }
}

/* Modal comparar: viaturas em lista (1 por linha) e botão no fim */
#modal-comparar { justify-content: flex-start; }
#modal-comparar .modal-content { max-width: 520px; }
#modal-comparar .compare-items { flex-direction: column; gap: 16px; overflow: visible; padding-bottom: 0; }
#modal-comparar .compare-item-list { width: 100%; flex-direction: column; gap: 12px; overflow-x: hidden; overflow-y: auto; max-height: 60vh; padding-bottom: 0; }
#modal-comparar .compare-item { min-width: 0; width: 100%; }
#modal-comparar .compare-item-image { width: 90px; min-width: 90px; }
#modal-comparar .compare-item-info .h7 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#modal-comparar .compare-action { width: 100%; }
#modal-comparar .compare-action .btn { width: 100%; justify-content: center; }

/* Comparador (até 8 viaturas): scroll horizontal com a 1.ª coluna fixa */
.comparar-barra { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.comparar-diferencas { display: inline-flex; align-items: center; gap: 8px; font-weight: 500; cursor: pointer; user-select: none; }
.comparar-diferencas input { width: 18px; height: 18px; accent-color: var(--pa-verde); cursor: pointer; }
.comparar-setas { display: flex; align-items: center; gap: 8px; }
.comparar-seta { width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--pa-linha); background: #fff; font-size: 22px; line-height: 1; cursor: pointer; transition: opacity .2s, border-color .2s; }
.comparar-seta:hover:not(:disabled) { border-color: var(--pa-verde); color: var(--pa-verde); }
.comparar-seta:disabled { opacity: .35; cursor: default; }
.comparar-moldura { position: relative; }
.comparar-moldura::after { content: ''; position: absolute; top: 0; right: 0; bottom: 0; width: 40px; pointer-events: none; background: linear-gradient(to left, rgba(0,0,0,.08), transparent); border-radius: 0 20px 20px 0; opacity: 0; transition: opacity .2s; }
.comparar-moldura.mais-direita::after { opacity: 1; }
.card-details.comparar-scroll { min-width: 0; overflow-x: auto; scroll-behavior: smooth; scrollbar-width: thin; }
.card-details.comparar-scroll::-webkit-scrollbar { display: block !important; height: 6px; }
.card-details.comparar-scroll::-webkit-scrollbar-thumb { background: #ccc; border-radius: 3px; }
.card-details .comparar-tabela { table-layout: auto; min-width: 0; }
.card-details .comparar-tabela tr td { width: 230px; min-width: 230px; padding: 12px 16px; font-size: 16px; background: #fff; }
.card-details .comparar-tabela tr td:nth-child(1) { width: 200px; min-width: 200px; position: sticky; left: 0; z-index: 2; }
.card-details .comparar-tabela tr span { font-size: 16px; }
.card-details .comparar-tabela tr:first-child td { vertical-align: top; padding-bottom: 16px; }
.card-details .comparar-tabela tr:first-child .top img.image { height: 150px; }
.comparar-scroll.deslizado .comparar-tabela tr td:nth-child(1) { box-shadow: 6px 0 8px -6px rgba(0,0,0,.15); }
.card-details .comparar-tabela td.comparar-melhor { color: var(--pa-verde); font-weight: 700; }
.comparar-tabela.so-diferencas tr[data-igual] { display: none; }

@media (max-width: 767px) {
    .card-details .comparar-tabela tr td { width: 160px; min-width: 160px; padding: 10px; font-size: 14px; }
    .card-details .comparar-tabela tr td:nth-child(1) { width: 110px; min-width: 110px; }
    .card-details .comparar-tabela tr span { font-size: 14px; }
    .card-details .comparar-tabela tr td:nth-child(1) img { display: none; }
    .card-details .comparar-tabela tr:first-child .top img.image { height: 100px; }
    .card-details .comparar-tabela .h5 { font-size: 15px; line-height: 20px; }
    .card-details .comparar-tabela .btn { padding: 8px 12px; font-size: 13px; }
}

/* Modal comparar: aviso de limite atingido, no topo da lista */
#modal-comparar .comparar-limite { margin: 0 0 16px; padding: 12px 16px; border-radius: 12px; background: #FFF4E5; border: 1px solid #F5C77E; color: #8A5300; font-size: 14px; line-height: 20px; }
#modal-comparar .comparar-limite[hidden] { display: none; }
/* Modal comparar: o fundo mantém o cursor normal (o template usa o ícone de fechar como cursor) */
#modal-comparar .bg-modal:hover { cursor: auto; }

/* Cartão da viatura: nome do stand no canto inferior da foto, cortado com reticências se for comprido */
.card-stand { min-width: 0; max-width: 65%; }
.card-stand a { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.card-stand a { text-decoration: none !important; }
/* Com logótipo: caixa branca pequena em vez do nome */
.card-stand-logo { display: flex; align-items: center; height: 34px; padding: 4px 8px; border-radius: 8px; background: rgba(255, 255, 255, .92); box-shadow: 0 1px 4px rgba(0, 0, 0, .15); }
.card-stand-logo a { display: flex; align-items: center; height: 100%; }
.card-stand-logo img { display: block; max-height: 26px; max-width: 110px; width: auto; height: auto; object-fit: contain; }

/* Botões dos tipos da pesquisa (página inicial): nome mais pequeno e normal, n.º de viaturas maior, a bold e branco */
.brand-item-small .brand-item-small__nome { font-size: 15px; font-weight: 400; color: inherit; }
.brand-item-small .brand-item-small__total { font-size: 18px; font-weight: 700; color: #fff; transition: color .3s ease; }
.brand-item-small:hover .brand-item-small__total { color: #1c1c1c; }