/*
 * Sul Fluminense Veículos: overrides do tema legado no site público (SPEC-11 / TASK-045).
 * Carregado DEPOIS de assets/css/master.css (que importa theme.css e color.css).
 * Rollback: remover os <link> de brand.css e brand-publico.css em Views/Shared/_Layout.cshtml.
 * Não altere o tema legado: todo ajuste de marca entra aqui, usando apenas var(--sfv-*).
 */

/* ---------- 1. Tipografia: Hind/Poppins -> Source Sans 3 (corpo) e Archivo (títulos) ---------- */
body,
input, select, textarea, button, .btn,
.form-control {
  font-family: var(--sfv-fonte-texto);
}
body { color: var(--sfv-texto); }

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.ui-title-page, .ui-title-block, .ui-title-block-2, .ui-title-inner,
.section-type-2__title, .section-type-2__subtitle,
.b-bnr-2, .b-bnr-3, .b-goods-feat__label, .b-goods-ac,
.b-car-info__item, .b-info_mod-b, .b-info-2,
.b-isotope-grid__info, .b-isotope-grid__title,
.main-slider, .main-slider-4,
.b-progress-list-2__item, .b-subscribe,
.post-widget__inner, .post-widget__title, .post-widget__date,
.section-form-contacts, .section-form-contacts__label,
.dropcap:first-letter,
.yamm.nav > li > a, .main-menu > li > a,
.footer .footer-section__title {
  font-family: var(--sfv-fonte-titulo);
}
h1, h2, h3, .ui-title-page, .ui-title-block, .ui-title-block-2 { font-weight: 800; }

/* ---------- 2. Cor primária: #d01818 (color.css) -> --sfv-primaria ---------- */
a,
.text-primary, .text-primary_h:hover, .text-primary_b:before, .text-primary_a:after,
.list > li > a:hover,
.pager li > a:hover, .pager li > a:hover .icon,
.pagination_primary > li:first-child > a:hover, .pagination_primary > li:first-child > a:hover .icon,
.pagination_primary > li:last-child > a:hover, .pagination_primary > li:last-child > a:hover .icon,
.search-close:hover,
.breadcrumb > li > a:hover, .breadcrumb > li > a > .icon,
.b-progress-list__percent, .b-list-brands__link:hover, .b-bnr__title,
.b-goods__price, .b-goods-ac__price,
.b-filter-type__input:checked + .b-filter-type__label .b-filter-type__icon,
.b-goods-links__link:hover,
.entry-meta__link:hover, .b-post .entry-title a:hover,
.b-subscribe__submit:hover,
.b-goods-1__info-link:after, .b-goods-1__choose:hover,
.btns-switch__item:hover, .btns-switch__item.active,
.b-goods-1_mod-a .b-goods-1__title,
.b-car-info__item-info, .b-blockquote-2:after,
.post-carousel .owl-nav div:hover:before,
.b-team-2__contact:hover, .accordion .btn-collapse:hover {
  color: var(--sfv-primaria);
}
a:hover, a:focus { color: var(--sfv-primaria-escura); }

.bg-primary, .bg-primary_h:hover, .bg-primary_b:before, .bg-primary_a:after,
.pagination_primary > .active > a, .pagination_primary > .active > span,
.pagination_primary > li > a:hover, .pagination_primary > li > a:focus,
.dropcap_primary:first-letter, .tooltip-1 .tooltip-inner,
.forms__label-check-1:after, .forms__label-radio-2:before, .forms__label-radio-1:after,
.ui-decor, .ui-decor:after, .ui-decor:before, .ui-decor-2,
.noUi-handle:after, .b-team__category, .b-isotope-grid__item .icon,
.b-blockquote__author:before, .owl-theme .owl-dots .owl-dot.active span,
.entry-meta__categorie, .area-bg_prim:after,
.footer-section__title:before, .b-goods-feat__name:before,
.b-advantages-2:hover, .b-post-1 .entry-title:before, .sp-thumbnail-title:before,
.sp-button:after, .ui-title-inner:before,
.list_mark-prim > li:before, .widget-list__item:hover:before,
.list-tags__link:hover, .entry-footer__tags:hover,
.accordion .btn-collapse .icon,
.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_default,
.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_current,
.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div.xdsoft_current,
.rent-carousel .owl-nav div:hover,
.b-advantages-5:hover .b-advantages-5__icon,
.progress-1 .progress-bar {
  background-color: var(--sfv-primaria);
}

.border_prim, .border_prim_h:hover,
.pagination > .active > a, .pagination > .active > span,
.pagination a:hover, .pagination span:hover, .pagination a:focus, .pagination span:focus,
.progress_border_primary, .forms__label-radio-2:before,
.b-filter-type-2__input:checked + .b-filter-type-2__label,
.rent-carousel .owl-nav div:hover { border-color: var(--sfv-primaria); }
.border-t_prim, .border-t_prim_h:hover, .tooltip-1.top .tooltip-arrow,
.tooltip-1.top-left .tooltip-arrow, .tooltip-1.top-right .tooltip-arrow { border-top-color: var(--sfv-primaria); }
.border-r_prim, .border-r_prim_h:hover, .tooltip-1.right .tooltip-arrow { border-right-color: var(--sfv-primaria); }
.border-b_prim, .border-b_prim_h:hover, .tooltip-1.bottom .tooltip-arrow,
.tooltip-1.bottom-left .tooltip-arrow, .tooltip-1.bottom-right .tooltip-arrow,
.table_primary > thead > tr > th, .collapse.in, .btn-up:after,
.b-filter-2__title, .b-bnr-2, .b-advantages-3.active { border-bottom-color: var(--sfv-primaria); }
.border-l_prim, .border-l_prim_h:hover, .tooltip-1.left .tooltip-arrow,
.border-left_primary:before, .form-sidebar__btn { border-left-color: var(--sfv-primaria); }
.b-advantages-3.active { box-shadow: 0 2px 0 0 var(--sfv-primaria); }

/* Paginação padrão (Bootstrap): página ativa em vermelho */
.pagination > .active > a, .pagination > .active > span,
.pagination > .active > a:hover, .pagination > .active > a:focus {
  color: var(--sfv-primaria-contraste);
  background-color: var(--sfv-primaria);
}

/* ---------- 3. Cor secundária legada: azul #0097c2 -> --sfv-secundaria (preto) ---------- */
.text-second, .text-second_h:hover, .link-tooltip-2, .forms__label-check-2:after { color: var(--sfv-secundaria); }
.bg-second, .bg-second_h:hover, .tooltip-2 .tooltip-inner, .dropcap_secondary:first-letter { background-color: var(--sfv-secundaria); }
.border_second, .border_second_h:hover, .progress_border_secondary { border-color: var(--sfv-secundaria); }
.border-t_second, .border-t_second_h:hover, .tooltip-2.top .tooltip-arrow,
.tooltip-2.top-left .tooltip-arrow, .tooltip-2.top-right .tooltip-arrow { border-top-color: var(--sfv-secundaria); }
.border-r_second, .border-r_second_h:hover, .tooltip-2.right .tooltip-arrow { border-right-color: var(--sfv-secundaria); }
.border-l_second, .border-l_second_h:hover, .tooltip-2.left .tooltip-arrow { border-left-color: var(--sfv-secundaria); }
.border-b_second, .border-b_second_h:hover, .tooltip-2.bottom .tooltip-arrow,
.tooltip-2.bottom-left .tooltip-arrow, .tooltip-2.bottom-right .tooltip-arrow,
.table_secondary > thead > tr > th { border-bottom-color: var(--sfv-secundaria); }

/* Pré-loader (spinner usa border-t_second_b / border-t_prim_a) */
.border-t_second_b:before { border-top-color: var(--sfv-secundaria); }
.border-t_prim_a:after { border-top-color: var(--sfv-primaria); }

/* ---------- 4. Alertas: amarelo #ffbc3a -> --sfv-acento (texto preto); laranja #ff523a -> primária ---------- */
.alert-1 { background-color: var(--sfv-acento); color: var(--sfv-acento-contraste); }
.alert-3 .alert-icon .icon { color: var(--sfv-alerta); }
.alert-4 .alert-icon .icon { color: var(--sfv-erro); }

/* ---------- 5. Botões ---------- */
.btn-primary {
  color: var(--sfv-primaria-contraste);
  background-color: var(--sfv-primaria);
  border-color: var(--sfv-primaria);
  font-family: var(--sfv-fonte-titulo);
  font-weight: 700;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active,
.btn-primary.active, .open > .dropdown-toggle.btn-primary {
  color: var(--sfv-primaria-contraste);
  background-color: var(--sfv-primaria-escura);
  border-color: var(--sfv-primaria-escura);
}
.btn:focus-visible, a:focus-visible { outline: 2px solid var(--sfv-acento); outline-offset: 2px; }

/* ---------- 6. Topo: barra superior e menu em preto, item ativo/hover em vermelho ---------- */
.header .top-bar,
.header.header-topbar-dark .top-bar { background-color: var(--sfv-secundaria); color: var(--sfv-secundaria-contraste); }
.header .top-bar a { color: var(--sfv-secundaria-contraste); }
.header .top-bar a:hover, .header .top-bar .icon { color: var(--sfv-primaria-negativo); }
#nav.navbar { background-color: var(--sfv-secundaria) !important; }
#nav .main-menu > li > a,
#nav .navbar-nav > li > a { color: var(--sfv-secundaria-contraste); }
.yamm.nav > li > a:focus, .yamm.nav > li > a:hover,
.yamm.nav > li.active > a {
  color: var(--sfv-primaria-contraste);
  background-color: var(--sfv-primaria);
}

/* Logo: altura fixa, largura automática (sem distorção). Topo e menu mobile são escuros -> versão negativa */
.navbar-brand { display: flex; align-items: center; height: auto; }
.sfv-logo { display: block; width: auto; max-width: 100%; height: 44px; object-fit: contain; }
.sfv-logo_topo { margin-top: 14px; margin-bottom: 14px; }
.sfv-logo_mobile { height: 40px; margin: 16px 10px; }
.sfv-logo_rodape { height: 48px; }
@media (max-width: 767px) {
  .sfv-logo_topo { height: 34px; margin-top: 10px; margin-bottom: 10px; }
}

/* Menu mobile (off-canvas) */
[data-off-canvas] { background-color: var(--sfv-secundaria); color: var(--sfv-secundaria-contraste); }
[data-off-canvas] a { color: var(--sfv-secundaria-contraste); }
[data-off-canvas] a:hover { color: var(--sfv-primaria-negativo); }

/* ---------- 7. Rodapé: fundo preto sólido, texto claro ---------- */
.footer { background: var(--sfv-secundaria); color: rgba(255, 255, 255, .78); }
.footer:after { background-color: var(--sfv-secundaria); opacity: 1; }
.footer a, .footer .footer-list__link, .footer .footer-contact a { color: rgba(255, 255, 255, .85); }
.footer a:hover, .footer .footer-list__link:hover,
.footer .text-primary, .footer .text-primary_h:hover { color: var(--sfv-primaria-negativo); }
.footer .footer-section__title { color: var(--sfv-secundaria-contraste); }
.footer .copyright { background-color: rgba(0, 0, 0, .4); color: rgba(255, 255, 255, .7); }
.footer .copyright__brand { color: var(--sfv-secundaria-contraste); }
.footer .copyright__link { color: rgba(255, 255, 255, .7); border-bottom-color: rgba(255, 255, 255, .7); }
.btn-up { background-color: var(--sfv-primaria); color: var(--sfv-primaria-contraste); }

/* Motivo gráfico: três faixas inclinadas no topo do rodapé */
.footer { position: relative; }
.footer:before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 6px;
  z-index: 2;
  background: repeating-linear-gradient(110deg,
    var(--sfv-primaria) 0 24px, transparent 24px 32px);
  background-size: 96px 6px;
  background-repeat: no-repeat;
  background-position: 16px 0;
}

/* ---------- 8. Preços dos veículos (equivalente a .sfv-preco) ---------- */
.b-goods-1__price, .b-car-info__price {
  font-family: var(--sfv-fonte-marca);
  font-style: italic;
  font-weight: 900;
  color: var(--sfv-primaria-contraste);
  background-color: var(--sfv-primaria);
}
.b-goods-1__price_th, .b-goods__price, .b-goods-ac__price, .main-slider__btn-price strong {
  font-family: var(--sfv-fonte-marca);
  font-style: italic;
  font-weight: 900;
}
.b-goods-1__price_th.text-primary, .b-goods__price, .b-goods-ac__price { color: var(--sfv-primaria); }

/* ---------- 9. Etiqueta de preço sobre a foto (Home e Carro usam .b-goods-feat__label para o PREÇO).
   Guia: preço em vermelho; amarelo fica só para selos de oferta. ---------- */
.b-goods-feat__label {
  background-color: var(--sfv-primaria);
  color: var(--sfv-primaria-contraste);
  font-family: var(--sfv-fonte-marca);
  font-style: italic;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}

/* ---------- 10. Formulários ---------- */
.form-control:focus, .search-global__input:focus {
  border-color: var(--sfv-primaria);
  box-shadow: 0 0 0 3px rgba(var(--sfv-primaria-rgb), .2);
}
.noUi-connect { background-color: var(--sfv-primaria); }
