/* These styles are generated from project.scss. */

.alert-debug {
  color: black;
  background-color: white;
  border-color: #d6e9c6;
}

.alert-error {
  color: #b94a48;
  background-color: #f2dede;
  border-color: #eed3d7;
}

:root {
  --fleet-ink: #112a2d;
  --fleet-muted: #647477;
  --fleet-teal: #1c7775;
  --fleet-coral: #ed765c;
  --fleet-sand: #f4efe7;
  --fleet-mist: #e4f0ed;
}

body {
  background: var(--fleet-sand);
  color: var(--fleet-ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.navbar {
  background: rgb(244 239 231 / 88%) !important;
  border-bottom: 1px solid rgb(17 42 45 / 10%);
  padding: 1.05rem 2.5rem;
}

.navbar-brand { color: var(--fleet-ink); font-weight: 800; letter-spacing: -.03em; }
.navbar-brand:hover { color: var(--fleet-teal); }
.brand-mark {
  display: inline-grid;
  width: 2rem;
  height: 2rem;
  margin-right: .35rem;
  place-items: center;
  border-radius: .7rem;
  background: var(--fleet-coral);
  color: white;
  font-size: 1rem;
}
.nav-link { color: var(--fleet-ink); font-weight: 600; }
.nav-link:hover { color: var(--fleet-teal); }
.container { max-width: 1240px; }
.vehicle-table-photo { width: 4rem; height: 3rem; border-radius: .4rem; object-fit: cover; background: var(--fleet-mist); }
.vehicle-photo-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: .75rem; padding: .75rem; }
.vehicle-photo-gallery__item { position: relative; min-height: 12rem; margin: 0; overflow: hidden; border-radius: .65rem; background: var(--fleet-mist); }
.vehicle-photo-gallery__item img { display: block; width: 100%; height: 100%; min-height: 12rem; object-fit: cover; }
.vehicle-photo-gallery__item figcaption { position: absolute; right: 0; bottom: 0; left: 0; padding: .55rem .7rem; background: rgb(17 42 45 / 72%); color: white; font-size: .8rem; }
.vehicle-details-list dt, .vehicle-details-list dd { margin-bottom: .65rem; }
.htmx-indicator { display: none; }
.htmx-request .htmx-indicator, .htmx-request.htmx-indicator { display: inline-block; }
.assistant-answer > :last-child { margin-bottom: 0; }
.assistant-shell { display: flex; min-height: min(72vh, 760px); flex-direction: column; gap: 1rem; }
.assistant-messages { display: flex; min-height: 0; flex: 1; flex-direction: column; justify-content: flex-end; gap: 1rem; overflow-y: auto; padding: 1rem .25rem; }
.assistant-message { max-width: min(85%, 760px); padding: 1rem 1.2rem; border-radius: 1.25rem; box-shadow: 0 .25rem 1rem rgb(17 42 45 / 7%); }
.assistant-message--user { align-self: flex-end; border-bottom-right-radius: .35rem; background: var(--fleet-teal); color: white; }
.assistant-message--assistant { align-self: flex-start; border-bottom-left-radius: .35rem; background: white; }
.assistant-question { white-space: pre-wrap; }
.assistant-answer { overflow-x: auto; }
.assistant-answer table { width: 100%; margin: 1rem 0; border-collapse: collapse; }
.assistant-answer th, .assistant-answer td { padding: .55rem .7rem; border: 1px solid rgb(17 42 45 / 14%); text-align: left; }
.assistant-answer th { background: var(--fleet-mist); font-weight: 700; }
.assistant-answer .table-wrapper { overflow-x: auto; }
.assistant-composer { position: sticky; bottom: 0; display: flex; align-items: flex-end; gap: .75rem; padding: .75rem; border: 1px solid rgb(17 42 45 / 12%); border-radius: 1.25rem; background: rgb(255 255 255 / 94%); box-shadow: 0 .5rem 2rem rgb(17 42 45 / 12%); backdrop-filter: blur(8px); }
.assistant-composer__input { min-width: 0; flex: 1; }
.assistant-composer__input textarea { min-height: 3rem; max-height: 10rem; resize: vertical; border: 0; box-shadow: none; }
.assistant-composer__input textarea:focus { box-shadow: none; }
.assistant-composer__actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .5rem; }
.assistant-empty { align-self: center; margin: auto; color: var(--fleet-muted); }
.assistant-empty p { color: var(--fleet-ink); font-size: 1.25rem; font-weight: 700; }
.assistant-page > .mb-1 { min-height: 4.5rem; }
.assistant-page .navbar { position: fixed; z-index: 1030; top: 0; right: 0; left: 0; }

.fleet-home { padding: 3.5rem 0 5rem; }
.fleet-hero {
  display: grid;
  min-height: 510px;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .85fr);
  align-items: center;
  gap: 3rem;
  padding: 4.5rem;
  overflow: hidden;
  border-radius: 2rem;
  background: var(--fleet-ink);
  color: white;
}
.eyebrow, .panel-kicker { color: var(--fleet-coral); font-size: .75rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.fleet-hero h1 { max-width: 650px; margin: 1rem 0; font-size: clamp(3.4rem, 7vw, 6.8rem); font-weight: 800; letter-spacing: -.075em; line-height: .91; }
.fleet-hero h1 span { color: #a7d9d1; }
.hero-lede { max-width: 480px; color: #c6d6d3; font-size: 1.15rem; line-height: 1.7; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }
.btn-fleet { border: 0; border-radius: 999px; background: var(--fleet-coral); color: white; font-weight: 800; padding: .9rem 1.35rem; }
.btn-fleet:hover { background: #f58d75; color: white; transform: translateY(-1px); }
.btn-quiet { border: 1px solid rgb(255 255 255 / 28%); border-radius: 999px; color: white; font-weight: 700; padding: .9rem 1.35rem; }
.btn-quiet:hover { border-color: white; color: white; }
.fleet-hero__visual { position: relative; min-height: 340px; }
.fleet-orb { position: absolute; top: 50%; left: 50%; display: grid; width: 220px; height: 220px; transform: translate(-50%, -50%); place-content: center; border: 1px solid rgb(167 217 209 / 55%); border-radius: 50%; background: radial-gradient(circle at 35% 25%, #3b9590, #1b5a5d 70%); box-shadow: 0 0 0 28px rgb(167 217 209 / 5%), 0 0 0 60px rgb(167 217 209 / 4%); text-align: center; }
.fleet-orb span { color: #a7d9d1; font-size: .8rem; font-weight: 800; letter-spacing: .25em; }
.fleet-orb strong { font-size: 2rem; letter-spacing: .08em; }
.route-line { position: absolute; width: 110%; height: 1px; border-top: 1px dashed rgb(167 217 209 / 50%); transform: rotate(-32deg); }
.route-line--one { top: 33%; left: -10%; }
.route-line--two { top: 68%; left: 0; transform: rotate(24deg); }
.location-pin { position: absolute; color: var(--fleet-coral); text-shadow: 0 0 15px rgb(237 118 92 / 70%); }
.location-pin--one { top: 19%; right: 10%; }
.location-pin--two { bottom: 14%; left: 13%; }
.fleet-stat { position: absolute; right: 0; bottom: 0; display: grid; padding: 1rem 1.2rem; border: 1px solid rgb(255 255 255 / 12%); border-radius: 1rem; background: rgb(255 255 255 / 7%); }
.fleet-stat strong { color: #a7d9d1; font-size: 1.4rem; }
.fleet-stat span { color: #c6d6d3; font-size: .75rem; }
.fleet-pillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-top: 1rem; }
.pillar-card { padding: 2rem; border: 1px solid rgb(17 42 45 / 9%); border-radius: 1.25rem; background: rgb(255 255 255 / 48%); }
.pillar-icon { margin-bottom: 2rem; color: var(--fleet-coral); font-weight: 800; }
.pillar-card h2 { font-size: 1.35rem; letter-spacing: -.03em; }
.pillar-card p, .about-panel p { color: var(--fleet-muted); line-height: 1.65; }
.about-page { padding: 4.5rem 0 5rem; }
.about-intro { max-width: 780px; margin-bottom: 4rem; }
.about-intro h1 { margin: 1rem 0; font-size: clamp(3rem, 7vw, 6rem); font-weight: 800; letter-spacing: -.075em; line-height: .95; }
.about-lede { color: var(--fleet-muted); font-size: 1.25rem; line-height: 1.7; }
.about-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
.about-panel { min-height: 300px; padding: 2.5rem; border-radius: 1.5rem; background: white; }
.about-panel--dark { background: var(--fleet-teal); color: white; }
.about-panel--dark p:not(.panel-kicker) { color: #d2e7e2; }
.about-panel h2 { max-width: 460px; margin: 1.2rem 0; font-size: 2.25rem; letter-spacing: -.05em; }
.about-callout { display: flex; align-items: center; justify-content: space-between; gap: 2rem; margin-top: 1rem; padding: 2.5rem; border-radius: 1.5rem; background: var(--fleet-mist); }
.about-callout h2 { margin: 0; font-size: 2rem; letter-spacing: -.05em; }
@media (max-width: 768px) {
  .navbar { padding: 1rem; }
  .fleet-home, .about-page { padding-top: 2rem; }
  .fleet-hero { grid-template-columns: 1fr; padding: 2.2rem; }
  .fleet-hero__visual { min-height: 260px; }
  .fleet-pillars, .about-grid { grid-template-columns: 1fr; }
  .about-callout { align-items: flex-start; flex-direction: column; }
  .assistant-shell { min-height: calc(100vh - 180px); }
  .assistant-message { max-width: 94%; }
  .assistant-composer { align-items: stretch; flex-direction: column; }
  .assistant-composer__actions { justify-content: stretch; }
  .assistant-composer__actions .btn { flex: 1; }
}