/* ==========================================================================
   AUTO AQUI — Tema visual (inspirado no padrão AutoShop)
   Carregado por ÚLTIMO no cabecalho.php para sobrescrever o tema antigo.

   Não altera HTML nem PHP: só aparência.
   Carrosséis e menu inferior do celular continuam funcionando igual.
   ========================================================================== */

:root{
    --aa-red:        #CA0654;   /* vermelho AutoShop (extraído do tema original) */
    --aa-red-dark:   #B7084E;
    --aa-ink:        #22282C;   /* texto forte  */
    --aa-ink-soft:   #6C767D;   /* texto de apoio */
    --aa-line:       #E8EBEE;   /* bordas       */
    --aa-bg:         #F4F6F8;   /* fundo        */
    --aa-radius:     10px;

    /* Fontes do AutoShop */
    --aa-font-title: 'Saira', 'Roboto', sans-serif;
    --aa-font-text:  'Commissioner', 'Roboto', sans-serif;
}

/* ---------- Base ---------------------------------------------------------- */
body{
    background: var(--aa-bg) !important;
    color: var(--aa-ink);
    font-family: var(--aa-font-text) !important;
}

/* Títulos, preços, selos e menu usam Saira (fonte do AutoShop) */
h1, h2, h3, h4, h5,
.card-title, .product-title,
.card-price, .price-new, .price-old,
.marketplace-block-title, .dk-section__head h2,
.header-nav .nav-pill, .dk-catnav__inner > a,
.pickup-badge, .sponsored-label, .low-stock-badge,
.dk-hero__content h1, .home-main-hero h1,
.dk-trust__card strong,
.sticky-mobile-cta__price,
.btn, .dk-btn-primary, .dk-btn-ghost{
    font-family: var(--aa-font-title) !important;
}

/* ---------- Cabeçalho ---------------------------------------------------- */
#header .header-top,
.header-top{
    background: #FFFFFF !important;
    border-bottom: 1px solid var(--aa-line) !important;
}
#header .header-top a,
#header .header-top .action-link,
#header .header-top .action-link span,
#header .header-top .action-link i{
    color: var(--aa-ink) !important;
}
#header .header-top .action-link:hover,
#header .header-top .action-link:hover i,
#header .header-top .action-link:hover span{
    color: var(--aa-red) !important;
}

/* barra de navegação (Categorias / Imóveis / Veículos / ...) */
.header-nav,
.dk-catnav{
    background: #FFFFFF !important;
    border-bottom: 1px solid var(--aa-line) !important;
    box-shadow: 0 1px 3px rgba(0,0,0,.04);
}
.header-nav .nav-pill,
.dk-catnav__inner > a{
    color: var(--aa-ink) !important;
    font-weight: 600 !important;
    letter-spacing: .2px;
    border-radius: 6px !important;
    transition: color .15s ease, background .15s ease;
}
.header-nav .nav-pill:hover,
.header-nav .nav-pill.is-active,
.dk-catnav__inner > a:hover{
    color: var(--aa-red) !important;
    background: rgba(202,6,84,.06) !important;
}
.dk-catnav__inner > a i,
.header-nav .nav-pill i{ color: var(--aa-red) !important; }

/* botão de busca */
.header-search-form button,
#btn_busca_mobile,
.dk-btn-primary,
.btn-primary,
.btn-success{
    background: var(--aa-red) !important;
    border-color: var(--aa-red) !important;
    color: #fff !important;
}
.header-search-form button:hover,
.dk-btn-primary:hover,
.btn-primary:hover,
.btn-success:hover{
    background: var(--aa-red-dark) !important;
    border-color: var(--aa-red-dark) !important;
}

/* ---------- CARD DO ANÚNCIO (padrão AutoShop) ---------------------------- */
.product-card,
.sponsored-card{
    background: #FFFFFF !important;
    border: 1px solid var(--aa-line) !important;
    border-radius: var(--aa-radius) !important;
    overflow: hidden !important;
    box-shadow: none !important;
    transition: box-shadow .18s ease, transform .18s ease;
}
.product-card:hover,
.sponsored-card:hover{
    box-shadow: 0 8px 24px rgba(20,25,30,.10) !important;
    transform: translateY(-2px);
}

/* imagem */
.product-card .card-image,
.sponsored-card .card-image,
.product-image-wrap{
    background: #F7F8FA !important;
    border-bottom: 1px solid var(--aa-line) !important;
    position: relative !important;
}
.product-card .card-image img,
.sponsored-card .card-image img{
    object-fit: cover !important;
    width: 100% !important;
}

/* corpo */
.product-card .card-body,
.sponsored-card .card-body,
.product-card-content{
    padding: 12px 14px 14px !important;
}

/* título: marca + modelo */
.product-card .card-title,
.sponsored-card .card-title,
.product-title{
    color: var(--aa-ink) !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    letter-spacing: .2px;
    margin: 4px 0 6px !important;
    min-height: 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* preço grande e forte, como no AutoShop */
.product-card .card-price,
.sponsored-card .card-price{
    margin: 8px 0 6px !important;
    display: flex !important;
    align-items: baseline !important;
    gap: 8px !important;
}
.product-card .price-new,
.sponsored-card .price-new,
.price-new{
    color: var(--aa-ink) !important;
    font-size: 23px !important;
    font-weight: 800 !important;
    letter-spacing: -.4px;
}
.price-old{
    color: var(--aa-ink-soft) !important;
    font-size: 13px !important;
    text-decoration: line-through !important;
    font-weight: 400 !important;
}

/* linha da loja / vendedor */
.product-card .card-store,
.card-store{
    color: var(--aa-ink-soft) !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    margin: 0 0 2px !important;
}
.card-store i{ color: var(--aa-red) !important; margin-right: 4px; }

/* ---------- SELOS -------------------------------------------------------- */
/* selo de condição / procedência (pill vermelho) */
.pickup-badge,
.low-stock-badge,
.card-badge,
.badge-condicao{
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    background: var(--aa-red) !important;
    color: #FFFFFF !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .3px;
    padding: 3px 9px !important;
    border-radius: 4px !important;
    border: 0 !important;
    text-transform: none !important;
}
.pickup-badge i,
.low-stock-badge i{ color:#fff !important; }

/* selo "Patrocinado" — faixa discreta no canto */
.sponsored-label{
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    z-index: 3 !important;
    background: var(--aa-red) !important;
    color: #fff !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    letter-spacing: .5px;
    text-transform: uppercase;
    padding: 4px 8px !important;
    border-radius: 4px !important;
    box-shadow: 0 2px 6px rgba(202,6,84,.35);
}
.sponsored-card .card-body .sponsored-label{ position: static !important; box-shadow:none !important; display:inline-block; margin-bottom:6px; }

/* views / urgência: neutro, sem cara de varejo */
.views-hot-badge{
    background: #F1F3F5 !important;
    color: var(--aa-ink-soft) !important;
    border: 1px solid var(--aa-line) !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    padding: 3px 8px !important;
    border-radius: 4px !important;
}
.views-hot-badge i{ color: var(--aa-red) !important; }

/* ---------- FAVORITO (coração, canto) ------------------------------------ */
.favorite-btn{
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    z-index: 3 !important;
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,.94) !important;
    border: 1px solid var(--aa-line) !important;
    color: var(--aa-red) !important;
    box-shadow: 0 2px 6px rgba(0,0,0,.08) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
}
.favorite-btn i{ color: var(--aa-red) !important; font-size: 14px !important; }
.favorite-btn:hover{ background:#fff !important; transform: scale(1.06); }

/* ---------- BOTÃO DE AÇÃO / WHATSAPP ------------------------------------- */
.product-card .btn,
.card-action,
.btn-card{
    border-radius: 6px !important;
    font-weight: 700 !important;
    letter-spacing: .2px;
}
/* CTA de WhatsApp sempre verde, em qualquer lugar do site */
a[href*="wa.me"],
a[href*="api.whatsapp.com"],
.btn-whatsapp{
    background: #25D366 !important;
    border-color: #25D366 !important;
    color: #FFFFFF !important;
}
a[href*="wa.me"]:hover,
a[href*="api.whatsapp.com"]:hover,
.btn-whatsapp:hover{
    background: #1EBE5A !important;
    border-color: #1EBE5A !important;
}
/* exceção: links de WhatsApp dentro de texto/rodapé não viram botão */
.footer a[href*="wa.me"],
p a[href*="wa.me"]{
    background: transparent !important;
    color: #25D366 !important;
}

/* ---------- TÍTULOS DE SEÇÃO --------------------------------------------- */
.marketplace-block-title,
.dk-section__head h2,
.section-title,
.home-section-title{
    color: var(--aa-ink) !important;
    font-weight: 800 !important;
    letter-spacing: -.2px;
    position: relative;
}
.dk-section__link,
.section-link{
    color: var(--aa-red) !important;
    font-weight: 700 !important;
}

/* ---------- CARDS DE CONFIANÇA (abaixo do hero) -------------------------- */
.dk-trust__card{
    background:#fff !important;
    border: 1px solid var(--aa-line) !important;
    border-radius: var(--aa-radius) !important;
    box-shadow: none !important;
}
.dk-trust__card i{ color: var(--aa-red) !important; }
.dk-trust__card strong{ color: var(--aa-ink) !important; }
.dk-trust__card span{ color: var(--aa-ink-soft) !important; }

/* ---------- HERO --------------------------------------------------------- */
.dk-hero,
.home-main-hero{
    border-radius: var(--aa-radius) !important;
    overflow: hidden !important;
}
.dk-hero__eyebrow,
.home-main-hero__eyebrow{
    background: rgba(202,6,84,.12) !important;
    color: #FFFFFF !important;
    border: 1px solid rgba(255,255,255,.25) !important;
    border-radius: 999px !important;
    font-weight: 700 !important;
}
.home-hero-cta,
.dk-hero__actions .dk-btn-primary{
    background: var(--aa-red) !important;
    border-color: var(--aa-red) !important;
    box-shadow: 0 6px 18px rgba(202,6,84,.30) !important;
}

/* ---------- CATEGORIAS --------------------------------------------------- */
.dk-cat,
.category-card{
    background:#fff !important;
    border: 1px solid var(--aa-line) !important;
    border-radius: var(--aa-radius) !important;
    transition: border-color .15s ease, transform .15s ease;
}
.dk-cat:hover,
.category-card:hover{
    border-color: var(--aa-red) !important;
    transform: translateY(-2px);
}

/* ---------- CARROSSEL (mantido, só ajusta as setas) ---------------------- */
.owl-carousel .owl-nav button,
.owl-prev, .owl-next,
.dk-carousel__nav{
    background: var(--aa-red) !important;
    color:#fff !important;
    border-radius: 4px !important;
    border: 0 !important;
}
.owl-carousel .owl-dot.active span{ background: var(--aa-red) !important; }

/* ---------- MENU INFERIOR DO CELULAR (mantido, recolorido) --------------- */
.mobile-bottom-nav{
    background:#FFFFFF !important;
    border-top: 1px solid var(--aa-line) !important;
    box-shadow: 0 -2px 12px rgba(0,0,0,.06) !important;
}
.mobile-bottom-nav a{ color: var(--aa-ink-soft) !important; }
.mobile-bottom-nav a.is-active,
.mobile-bottom-nav a.is-active i,
.mobile-bottom-nav a.is-active span{ color: var(--aa-red) !important; }
.mobile-bottom-nav__badge{
    background: var(--aa-red) !important;
    color:#fff !important;
    border: 2px solid #fff !important;
}

/* ---------- PÁGINA DO ANÚNCIO ------------------------------------------- */
.product-detail .price-new,
.produto-preco,
#valor_produto_pagina{
    color: var(--aa-ink) !important;
    font-weight: 800 !important;
}
.ficha-tecnica,
.product-specs{
    background:#fff !important;
    border: 1px solid var(--aa-line) !important;
    border-radius: var(--aa-radius) !important;
}
.ficha-tecnica strong,
.product-specs strong{ color: var(--aa-ink) !important; }

/* botão fixo do celular no anúncio */
.sticky-mobile-cta{
    background:#FFFFFF !important;
    border-top: 1px solid var(--aa-line) !important;
    box-shadow: 0 -2px 14px rgba(0,0,0,.08) !important;
}
.sticky-mobile-cta__price{ color: var(--aa-ink) !important; font-weight: 800 !important; }

/* ---------- RODAPÉ ------------------------------------------------------- */
.footer,
#footer{
    background: #1B2126 !important;
    color: #C8D0D6 !important;
}
.footer a, #footer a{ color:#C8D0D6 !important; }
.footer a:hover, #footer a:hover{ color: var(--aa-red) !important; }

/* ---------- LIMPEZA: esconde o que sobrou de varejo ---------------------- */
.cart-link,
.cart-flyout,
#cart-flyout,
.btn-cart,
.add-to-cart{
    display: none !important;
}

/* ==========================================================================
   CARD DO ANÚNCIO — estrutura AutoShop
   selo + código / marca modelo / versão / preço / ano · km
   ========================================================================== */

.aa-card{ display:flex !important; flex-direction:column !important; }

/* foto */
.aa-card .aa-thumb{
    position:relative !important;
    aspect-ratio: 4 / 3;
    overflow:hidden !important;
}
.aa-card .aa-thumb img{
    width:100% !important; height:100% !important;
    object-fit:cover !important;
}

/* fita "Super Oferta" no canto */
.aa-card .aa-fita{
    position:absolute !important; top:0 !important; right:0 !important; z-index:4 !important;
    background: var(--aa-red) !important; color:#fff !important;
    font-family: var(--aa-font-title) !important;
    font-size:11px !important; font-weight:800 !important;
    line-height:1.05 !important; text-transform:uppercase; text-align:center;
    padding:8px 12px !important;
    border-bottom-left-radius:8px !important;
    box-shadow:0 2px 8px rgba(202,6,84,.4);
}

/* corpo */
.aa-card .aa-body{ padding:12px 14px 14px !important; display:flex; flex-direction:column; gap:0; }

/* linha 1: selo + código */
.aa-card .aa-toprow{
    display:flex !important; align-items:center !important; gap:10px !important;
    margin-bottom:8px !important;
}
.aa-card .aa-cond{
    background: var(--aa-red) !important; color:#fff !important;
    font-family: var(--aa-font-title) !important;
    font-size:11px !important; font-weight:700 !important;
    padding:3px 9px !important; border-radius:4px !important;
    white-space:nowrap;
}
.aa-card .aa-codigo{
    color: var(--aa-ink-soft) !important;
    font-size:12px !important; font-weight:500 !important;
}

/* título: marca escura + modelo vermelho */
.aa-card .aa-titulo{
    display:block !important;
    font-family: var(--aa-font-title) !important;
    font-size:19px !important; font-weight:700 !important;
    line-height:1.2 !important; letter-spacing:.2px;
    text-decoration:none !important; margin-bottom:6px !important;
}
.aa-card .aa-marca{ color: var(--aa-ink) !important; }
.aa-card .aa-modelo{ color: var(--aa-red) !important; }
.aa-card .aa-titulo:hover .aa-marca{ color: var(--aa-red) !important; }

/* versão */
.aa-card .aa-versao{
    color: var(--aa-ink-soft) !important;
    font-size:11.5px !important; font-weight:500 !important;
    text-transform:uppercase; letter-spacing:.3px;
    margin:0 0 8px !important;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* loja */
.aa-card .card-store{ font-size:11.5px !important; margin:0 0 6px !important; }

/* preço */
.aa-card .aa-preco{ margin:2px 0 10px !important; }
.aa-card .aa-preco .price-new{
    font-family: var(--aa-font-title) !important;
    font-size:22px !important; font-weight:800 !important;
    color: var(--aa-ink) !important; letter-spacing:-.5px;
}

/* rodapé: ano · km + coração */
.aa-card .aa-rodape{
    display:flex !important; align-items:center !important; justify-content:space-between !important;
    border-top:1px solid var(--aa-line) !important;
    padding-top:10px !important; margin-top:auto !important;
}
.aa-card .aa-meta{ display:flex !important; gap:14px !important; }
.aa-card .aa-meta span{
    color: var(--aa-ink-soft) !important;
    font-size:12.5px !important; font-weight:500 !important;
}
/* no rodapé o coração volta a ser inline (não sobre a foto) */
.aa-card .aa-rodape .favorite-btn{
    position:static !important;
    width:auto !important; height:auto !important;
    background:transparent !important; border:0 !important; box-shadow:none !important;
}
.aa-card .aa-rodape .favorite-btn i{ font-size:17px !important; }

/* esconde restos do layout de varejo dentro do card novo */
.aa-card .card-button,
.aa-card .reserve-button,
.aa-card .pickup-badge,
.aa-card .product-urgency-row,
.aa-card .card-rating,
.aa-card .low-stock-badge{ display:none !important; }