/* CSS Dinâmico via PHP injeta :root com --primary, --secondary, --accent, --bg */

/* Utilitários de cor baseados nas variáveis */
.text-primary-custom  { color: var(--primary) !important; }
.text-secondary-custom{ color: var(--secondary) !important; }
.text-accent          { color: var(--accent) !important; }
.bg-primary-custom    { background-color: var(--primary) !important; }
.bg-secondary-custom  { background-color: var(--secondary) !important; }
.bg-accent            { background-color: var(--accent) !important; }

body {
  background-color: var(--bg, #ffffff);
  color: #0f172a;
}

.btn-primary-custom {
  background-color: var(--primary);
  border-color: var(--primary);
  color: var(--btn-primary-text, #fff);
}
.btn-primary-custom:hover {
  background-color: color-mix(in srgb, var(--primary) 80%, black);
  border-color: color-mix(in srgb, var(--primary) 80%, black);
  color: var(--btn-primary-text, #fff);
}
.btn-secondary-custom {
  background-color: var(--secondary);
  border-color: var(--secondary);
  color: var(--btn-secondary-text, #fff);
}
.btn-secondary-custom:hover {
  background-color: color-mix(in srgb, var(--secondary) 80%, black);
  color: var(--btn-secondary-text, #fff);
}
.btn-outline-primary-custom {
  border-color: var(--primary);
  color: var(--primary);
  background-color: #fff;
}
.btn-outline-primary-custom:hover {
  background-color: var(--primary);
  color: var(--btn-primary-text, #fff);
}

/* Top Bar */
.topbar {
  background: linear-gradient(
    90deg,
    var(--header-gradient-start, #ffffff) var(--header-gradient-pos, 36%),
    var(--primary) calc(var(--header-gradient-pos, 36%) + 22%)
  );
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .08);
}
.topbar-esq,
.topbar-esq .text-white  { color: var(--topbar-texto, #ffffff) !important; }
.topbar-esq .text-white-50 { color: color-mix(in srgb, var(--topbar-texto, #ffffff) 55%, transparent) !important; }
.topbar-esq a { color: var(--topbar-texto, #ffffff) !important; }
.topbar-esq a:hover,
.topbar-esq a:focus { color: var(--topbar-texto, #ffffff) !important; opacity: .82; }
.topbar-dir,
.topbar-dir .text-white  { color: var(--topbar-texto-dir, var(--topbar-texto, #ffffff)) !important; }
.topbar-dir .text-white-50 { color: color-mix(in srgb, var(--topbar-texto-dir, var(--topbar-texto, #ffffff)) 55%, transparent) !important; }
.topbar-dir a { color: var(--topbar-texto-dir, var(--topbar-texto, #ffffff)) !important; }
.topbar-dir a:hover,
.topbar-dir a:focus { color: var(--topbar-texto-dir, var(--topbar-texto, #ffffff)) !important; opacity: .82; }
.topbar-phrase { font-size: 1rem; }

/* Footer */
.footer-bg,
.footer-bg .text-white  { color: var(--navbar-texto, #ffffff) !important; }
.footer-bg .text-white-50 { color: color-mix(in srgb, var(--navbar-texto, #ffffff) 55%, transparent) !important; }

.horario-card {
  margin: .75rem 0 1rem;
  padding: .85rem 1rem;
  border: 1px solid color-mix(in srgb, var(--primary) 20%, #dbe4ef);
  border-radius: .9rem;
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(248,250,252,.98));
  box-shadow: 0 10px 22px rgba(15, 23, 42, .06);
}
.horario-card-title {
  display: flex;
  align-items: center;
  gap: .55rem;
  margin-bottom: .45rem;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--primary);
}
.horario-card-lines {
  display: grid;
  gap: .25rem;
}
.horario-card-line {
  font-size: .94rem;
  line-height: 1.45;
  color: #334155;
}
.horario-card-compact {
  margin: .65rem 0 0;
  padding: .7rem .85rem;
  border-color: color-mix(in srgb, var(--navbar-texto, #ffffff) 16%, transparent);
  background: rgba(255,255,255,.06);
  box-shadow: none;
}
.horario-card-compact .horario-card-title,
.horario-card-compact .horario-card-line {
  color: var(--navbar-texto, #ffffff);
}
.horario-card-compact .horario-card-line {
  opacity: .82;
  font-size: .85rem;
}

/* Sidebar ADM */
.sidebar,
.sidebar .nav-link,
.sidebar a.text-white { color: var(--navbar-texto, #ffffff) !important; }
.sidebar .text-white-50 { color: color-mix(in srgb, var(--navbar-texto, #ffffff) 55%, transparent) !important; }

/* Navbar */
.navbar { padding-top: .7rem; padding-bottom: .7rem; }
.navbar-anim {
  background: linear-gradient(
    90deg,
    var(--header-gradient-start, #ffffff) var(--header-gradient-pos, 36%),
    var(--primary) calc(var(--header-gradient-pos, 36%) + 22%)
  ) !important;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .08);
  transition: box-shadow 0.35s ease, padding 0.35s ease;
}
.navbar-anim.scrolled {
  box-shadow: 0 10px 28px rgba(15, 23, 42, .14);
  padding-top: .55rem;
  padding-bottom: .55rem;
}

.brand-lockup {
  display: inline-flex;
  align-items: center;
  gap: .85rem;
  min-width: 0;
}
.brand-logo {
  display: block;
  max-height: 140px;
  width: auto;
  object-fit: contain;
  flex-shrink: 0;
}
.brand-title {
  color: var(--header-title-color, var(--navbar-texto, #ffffff));
  font-weight: 800;
  font-size: clamp(1.15rem, 1.8vw, 1.8rem);
  line-height: 1.05;
  letter-spacing: -.02em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: min(42vw, 420px);
}
.navbar-anim .navbar-brand,
.navbar-anim .nav-link,
.navbar-anim .navbar-brand:hover,
.navbar-anim .navbar-brand:focus {
  color: var(--navbar-texto, #ffffff) !important;
}
.navbar-anim .nav-link:hover,
.navbar-anim .nav-link:focus {
  color: var(--navbar-texto, #ffffff) !important;
  background: rgba(255, 255, 255, .16);
}
.navbar-anim .nav-link {
  border-radius: .6rem;
  font-weight: 600;
  padding-inline: .85rem !important;
}
.navbar-anim .navbar-toggler {
  border-color: color-mix(in srgb, var(--navbar-texto, #ffffff) 50%, transparent) !important;
}
.navbar-anim .navbar-toggler:focus {
  box-shadow: 0 0 0 .18rem color-mix(in srgb, var(--navbar-texto, #ffffff) 28%, transparent);
}
.navbar-anim .navbar-collapse {
  margin-top: .35rem;
}

/* Hero */
.hero-overlay {
  background: linear-gradient(135deg, rgba(0,0,0,.65) 0%, rgba(0,0,0,.3) 100%);
  top: 0; left: 0;
}

/* Hero carousel — crossfade lento + Ken Burns */
#heroCarousel .carousel-inner { overflow: hidden; background: #111; }

#heroCarousel .carousel-item {
  transition: opacity 1.5s ease-in-out !important;
  transform: none !important;
}

/* Ken Burns no ::before para não conflitar com o transform do Bootstrap */
#heroCarousel .carousel-item::before {
  content: '';
  position: absolute;
  inset: 0;
  background: inherit;
  background-size: cover !important;
  background-position: center !important;
  transform: scale(1) translateZ(0);
  transition: none;
}

#heroCarousel .carousel-item.active::before {
  animation: heroKenBurns 7s ease-out both;
}

@keyframes heroKenBurns {
  from { transform: scale(1)    translateZ(0); }
  to   { transform: scale(1.08) translateZ(0); }
}

/* Badge Destaque */
.badge-destaque {
  display: inline-flex;
  align-items: center;
  gap: .28rem;
  background-color: color-mix(in srgb, var(--secondary) 75%, black);
  color: #fff;
  font-size: .72rem;
  font-weight: 700;
  padding: .28em .6em;
  border-radius: .375rem;
  letter-spacing: .3px;
  white-space: nowrap;
  box-shadow: 0 1px 4px rgba(0,0,0,.25);
}
.badge-destaque .bi-star-fill {
  color: color-mix(in srgb, var(--secondary) 90%, white);
  font-size: .85em;
}

/* Section title */
.section-title {
  position: relative;
  padding-bottom: .5rem;
}
.section-title::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0;
  width: 50px; height: 3px;
  background: var(--secondary);
  border-radius: 2px;
}

/* Cards veículo */
.card-veiculo { transition: transform .2s, box-shadow .2s; }
.card-veiculo:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(0,0,0,.12) !important; }

/* Footer */
.footer-bg { background-color: var(--footer-bg, color-mix(in srgb, var(--primary) 90%, black)); }

.bg-white,
.card,
.modal-content,
.accordion-item {
  color: #0f172a;
}

.text-muted,
.form-text,
.bg-white .text-muted,
.bg-light .text-muted {
  color: #5b6472 !important;
}

.btn-outline-secondary {
  background: #fff;
  border-color: #cbd5e1;
  color: #334155;
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus {
  background: #f8fafc;
  border-color: var(--primary);
  color: #0f172a;
}

.btn-light,
.btn-outline-light {
  color: #0f172a;
}

.card-header.bg-white,
.card-header.bg-light {
  color: #334155;
}

@media (max-width: 991.98px) {
  .brand-title {
    max-width: 52vw;
    font-size: 1.05rem;
  }

  .navbar-anim .navbar-collapse {
    margin-top: .75rem;
    padding: .85rem;
    border-radius: 1rem;
    background: rgba(15, 23, 42, .12);
    backdrop-filter: blur(6px);
  }
}

/* Paginação ativa */
.page-item.active .page-link {
  background-color: var(--primary);
  border-color: var(--primary);
}
.page-link { color: var(--primary); }

/* Sidebar admin */
.sidebar .nav-link:hover { background: rgba(255,255,255,.15); border-radius: .375rem; }

/* Topbar mobile admin */
.adm-topbar {
  position: sticky;
  top: 0;
  z-index: 1040;
  box-shadow: 0 2px 8px rgba(0,0,0,.25);
}

/* Offcanvas sidebar — mesma aparência da sidebar desktop */
#sidebarOffcanvas .nav-link:hover { background: rgba(255,255,255,.15); border-radius: .375rem; }

/* Thumb fotos */
.thumb-foto:hover { opacity: 1 !important; }

@media (max-width: 576px) {
  .hero-section { min-height: 380px !important; }
  .hero-section h1 { font-size: 1.6rem; }
}
