/* =====================================================================================
   TFD — Tratamento Fora do Domicílio (out/2026), na fundação mm-*. As listas são grades .mm-grade
   (mc-modulo.css: linhas em div, onde content-visibility funciona); aqui só as colunas de cada uma.
   ===================================================================================== */

.tfd .tfd-g-sol { --cols: 118px minmax(210px, 1.4fr) minmax(170px, 1.1fr) minmax(170px, 1.2fr) 132px 150px 40px; }
.tfd .tfd-g-via { --cols: 104px minmax(200px, 1.3fr) minmax(160px, 1fr) minmax(150px, 1fr) minmax(130px, .9fr) 132px 150px; }
.tfd .tfd-g-aju { --cols: 118px minmax(200px, 1.3fr) minmax(130px, .9fr) 150px 110px 150px 150px; }
.tfd .tfd-g-vei { --cols: 112px minmax(190px, 1.3fr) 96px 110px minmax(170px, 1fr) 132px 130px; }
.tfd .tfd-g-mot { --cols: minmax(210px, 1.4fr) 132px 110px minmax(150px, 1fr) 128px 132px 150px; }
.tfd .tfd-g-loc { --cols: minmax(220px, 1.5fr) minmax(150px, 1fr) 120px minmax(170px, 1.1fr) 110px 130px; }

.tfd .tfd-proc { font-family: var(--p-mono); font-size: .72rem; font-weight: 700; color: var(--p-ink); white-space: nowrap; }
.tfd .tfd-sub { font-size: .7rem; color: var(--p-faint); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tfd .tfd-alerta { color: var(--p-orange); font-weight: 700; }
.tfd .tfd-alerta.grave { color: var(--p-red); }

/* Detalhe da solicitação: duas colunas (o pedido | situação, viagens e ajuda). */
.tfd .tfd-det { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(320px, 1fr); gap: 14px; align-items: start; }
.tfd .tfd-linha-tempo { display: flex; flex-direction: column; gap: 8px; }
.tfd .tfd-passo { display: flex; gap: 10px; align-items: flex-start; font-size: .76rem; color: var(--p-text); }
.tfd .tfd-passo i { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; flex: none;
    background: var(--tom-soft, var(--p-soft)); color: var(--tom, var(--p-muted)); font-size: .9rem; }
.tfd .tfd-passo b { color: var(--p-ink); }
.tfd .tfd-passo .mm-xs { display: block; }

/* Linhas das viagens e das ajudas dentro do detalhe (lista curta, da própria solicitação). */
.tfd .tfd-subitem { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-top: 1px solid var(--p-border-soft); }
.tfd .tfd-subitem:first-child { border-top: none; }

/* Modais: aviso de lotação do veículo no dia. */
.tfd-lotacao { display: flex; align-items: center; gap: 10px; font-size: .74rem; color: var(--p-muted); }
.tfd-lotacao .mm-bar-track { flex: 1; height: 8px; }

/* =====================================================================================
   Frota e transporte (out/2026): Agenda da frota, Transportes, Mapa, Gastos e o app do motorista.
   Só tokens --p-* (o escuro vem da fundação); nada de media query de largura (mc-scaled cuida da escala).
   ===================================================================================== */

/* Agenda: um cartão por saída, com a borda na cor da etapa. content-visibility como as linhas da grade. */
.tfd .tfd-saidas { display: flex; flex-direction: column; gap: 10px; padding: 12px; }
.tfd .tfd-saida { border: 1px solid var(--p-border); border-left: 4px solid var(--tom, var(--p-blue)); border-radius: 12px;
    background: var(--p-surface); content-visibility: auto; contain-intrinsic-size: auto 180px; }
.tfd .tfd-saida.apagada { opacity: .6; }
.tfd .tfd-saida.destaque { box-shadow: 0 0 0 3px var(--p-blue-line); }
.tfd .tfd-saida-topo { display: flex; align-items: center; gap: 12px; padding: 12px 14px 8px; }
.tfd .tfd-saida-hora { display: flex; flex-direction: column; align-items: center; min-width: 62px; padding: 4px 8px; border-radius: 10px;
    background: var(--tom-soft, var(--p-soft)); color: var(--tom, var(--p-ink)); }
.tfd .tfd-saida-hora b { font-size: 1.05rem; font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1.2; }
.tfd .tfd-saida-hora span { font-size: .62rem; font-weight: 700; opacity: .85; white-space: nowrap; }
.tfd .tfd-saida-destino { display: flex; align-items: center; gap: 6px; font-size: .86rem; font-weight: 800; color: var(--p-ink); min-width: 0; }
.tfd .tfd-saida-destino > span:first-of-type { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tfd .tfd-saida-destino > i { color: var(--tom, var(--p-blue)); }
.tfd .tfd-saida-lot { display: flex; align-items: center; gap: 6px; width: 120px; flex: none; font-size: .7rem; font-weight: 700; color: var(--p-muted); }
.tfd .tfd-saida-lot .mm-bar-track { flex: 1; height: 7px; }
.tfd .tfd-saida-tl { display: flex; flex-wrap: wrap; gap: 4px 14px; padding: 0 14px 8px 88px; font-size: .7rem; color: var(--p-muted); }
.tfd .tfd-saida-tl i { margin-right: 3px; color: var(--p-faint); }
.tfd .tfd-pax-lista { border-top: 1px solid var(--p-border-soft); }
.tfd .tfd-pax { display: flex; align-items: center; gap: 10px; padding: 8px 14px; border-top: 1px solid var(--p-border-soft); }
.tfd .tfd-pax:first-child { border-top: none; }
.tfd .tfd-pax.apagada { opacity: .55; }
.tfd .tfd-pax .acoes { display: flex; align-items: center; gap: 4px; flex: none; }
.tfd .tfd-pax-nome { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; font-size: .78rem; font-weight: 700; color: var(--p-ink); }
.tfd .tfd-pax-vazio { padding: 10px 14px; border-top: 1px solid var(--p-border-soft); font-size: .72rem; color: var(--p-faint); }
.tfd .tfd-emb { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; flex: none; font-size: .9rem;
    background: var(--p-soft); color: var(--p-faint); border: 1px dashed var(--p-border-strong); }
.tfd .tfd-emb.embarcou { background: var(--p-green-soft); color: var(--p-green); border: 1px solid var(--p-green-line); }
.tfd .tfd-emb.faltou { background: var(--p-red-soft); color: var(--p-red); border: 1px solid var(--p-red-line); }
.tfd .tfd-saida-obs { padding: 6px 14px; border-top: 1px solid var(--p-border-soft); font-size: .72rem; color: var(--p-text); }
.tfd .tfd-saida-obs i { margin-right: 4px; }
.tfd .tfd-saida-acoes { display: flex; align-items: center; gap: 6px; padding: 8px 14px; border-top: 1px solid var(--p-border-soft); background: var(--p-soft);
    border-radius: 0 0 11px 11px; }
.tfd .tfd-sem-saida { max-height: 640px; overflow: auto; }
.tfd .tfd-sem-saida .tfd-pax { align-items: flex-start; }
.tfd .tfd-nec { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 3px; }

/* "Pôr na saída": as saídas do dia como opções. */
.tfd-opcoes { display: flex; flex-direction: column; gap: 6px; }
.tfd-opcao { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--p-border); border-radius: 10px; cursor: pointer; }
.tfd-opcao.on { border-color: var(--p-blue-light); background: var(--p-blue-soft); }
.tfd-opcao.cheia { opacity: .55; cursor: not-allowed; }
.tfd-opcao .strong { font-size: .78rem; font-weight: 700; color: var(--p-ink); }
.tfd-opcao .tfd-sub { font-size: .7rem; color: var(--p-faint); }
.tfd-opcao .tfd-alerta { color: var(--p-orange); font-weight: 700; }

/* Transportes */
.tfd .tfd-g-trp { --cols: 112px minmax(200px, 1.3fr) minmax(170px, 1.1fr) minmax(140px, 1fr) minmax(150px, 1fr) 128px 170px; }
.tfd .tfd-transf { margin-bottom: 14px; border-color: var(--p-orange-line); }
.tfd .tfd-transf-lista { display: flex; flex-direction: column; gap: 6px; padding: 10px 12px; max-height: 260px; overflow: auto; }
.tfd .tfd-link-saida { font-size: .72rem; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }
.tfd-necessidades { display: flex; flex-wrap: wrap; gap: 8px 18px; }

/* Mapa */
.tfd .tfd-mapa-canvas { height: 620px; background: var(--p-soft); border-radius: 0; z-index: 0; }
.tfd .tfd-mapa-legenda { flex-wrap: wrap; gap: 14px; font-size: .68rem; color: var(--p-muted); }
.tfd .tfd-mapa-legenda .dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 5px; vertical-align: -1px; }
.tfd .tfd-mapa-lista { display: flex; flex-direction: column; gap: 6px; padding: 10px; }
.tfd .tfd-mapa-lista .mm-item { cursor: pointer; }
.tfd .tfd-mapa-lista .mm-item.apagada { opacity: .6; }
.tfd .tfd-trajeto-resumo { display: flex; flex-direction: column; gap: 3px; }
.tfd .tfd-trajeto-resumo .tfd-sub { white-space: normal; }
.frota-marcador { background: none; border: none; }
.frota-marcador .frota-pino { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; color: #fff; font-size: 18px;
    background: var(--cor); border: 3px solid #fff; box-shadow: 0 2px 8px rgba(15, 23, 42, .35); }
.frota-marcador .frota-pino i { display: block; line-height: 1; }
.frota-marcador .frota-placa { margin: 2px auto 0; width: max-content; max-width: 110px; padding: 1px 6px; border-radius: 6px; background: rgba(15, 23, 42, .82);
    color: #fff; font: 700 10px/1.4 system-ui, sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transform: translateX(-50%); margin-left: 50%; }
.frota-marcador.velho .frota-pino { filter: grayscale(1); opacity: .7; }
.frota-marcador.sel .frota-pino { box-shadow: 0 0 0 4px rgba(37, 99, 235, .45), 0 2px 8px rgba(15, 23, 42, .35); }
.frota-destino { background: none; border: none; color: #dc2626; font-size: 24px; text-shadow: 0 1px 2px rgba(0, 0, 0, .35); }

/* Gastos */
.tfd .tfd-g-gas { --cols: 100px minmax(170px, 1fr) minmax(140px, .9fr) minmax(220px, 1.6fr) 110px 128px 170px; }
.tfd .tfd-g-cus { --cols: minmax(200px, 1.5fr) 70px 90px 110px 120px 120px 110px 120px 90px; }
.tfd .tfd-total { background: var(--p-soft); font-weight: 700; content-visibility: visible; }
.tfd .tfd-ico-gasto { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; flex: none; font-size: 1rem;
    background: var(--tom-soft, var(--p-soft)); color: var(--tom, var(--p-muted)); }
.tfd .tfd-det-gasto { font-size: .74rem; color: var(--p-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tfd-tipos-gasto { display: flex; flex-wrap: wrap; gap: 6px; }

/* App do motorista: situação e convite (QR). */
.tfd-app-situacao { display: flex; align-items: center; gap: 12px; padding: 4px 0 12px; }
.tfd-app-situacao .strong { font-size: .86rem; font-weight: 800; color: var(--p-ink); }
.tfd-app-situacao .tfd-sub { font-size: .72rem; color: var(--p-muted); }
.tfd-app-ico { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; font-size: 1.3rem; flex: none;
    background: var(--tom-soft, var(--p-soft)); color: var(--tom, var(--p-muted)); }
.tfd-convite { display: flex; gap: 18px; align-items: center; margin-bottom: 12px; }
.tfd-convite-qr { width: 210px; height: 210px; flex: none; padding: 10px; background: #fff; border: 1px solid var(--p-border); border-radius: 14px; }
.tfd-convite-qr svg { width: 100%; height: 100%; display: block; }
.tfd-convite-txt ol { margin: 0 0 12px; padding-left: 18px; font-size: .76rem; line-height: 1.7; color: var(--p-text); }
.tfd-convite-cod { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: 12px; background: var(--p-soft); border: 1px dashed var(--p-border-strong); }
.tfd-convite-cod span { font-size: .66rem; color: var(--p-faint); font-weight: 600; }
.tfd-convite-cod b { font-family: var(--p-mono); font-size: 1.5rem; letter-spacing: 3px; color: var(--p-ink); }
