/* frota.css — Gestão de Frotas
   O painel reutiliza DE PROPÓSITO as classes internas .re-* do
   rotas-escolares.css (header/tabs/btn/card/form/banner): os dois módulos
   devem ser visualmente idênticos. Aqui só o container #ftPanel (espelho do
   #rePanel, deslocado p/ não abrir exatamente em cima dele). */
#ftPanel {
  position: fixed;
  top: 90px;                                   /* 20px abaixo do rePanel */
  left: max(16px, calc(100vw - 496px));
  right: auto;
  width: 460px;
  max-width: calc(100vw - 32px);
  height: 78vh;
  max-height: calc(100vh - 110px);
  min-width: 320px;
  min-height: 240px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 10px 34px rgba(0, 0, 0, .35);
  z-index: 10050;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  font: 13px/1.45 system-ui, -apple-system, "Segoe UI", sans-serif;
  color: #1a2533;
}
#ftPanel.hidden { display: none; }
/* Alça de resize (dica visual; o resize real é do _enablePanelInteract) */
#ftPanel::after {
  content: "";
  position: absolute;
  right: 3px; bottom: 3px;
  width: 15px; height: 15px;
  pointer-events: none;
  opacity: .85;
  background:
    linear-gradient(135deg, transparent 0 50%, #9fb3c8 50% 55%, transparent 55% 65%,
      #9fb3c8 65% 70%, transparent 70% 80%, #9fb3c8 80% 85%, transparent 85%);
}