/* Hoje (web 02) e Agenda (web 03). Só tokens. */
.cabeca-hoje { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--okf-space-4); flex-wrap: wrap; }
.barra-acoes { display: flex; gap: var(--okf-space-2); align-items: center; flex-wrap: wrap; }
.btn-pequeno { min-height: 44px; padding: 0 var(--okf-space-4); font-size: 15px; }
.btn-icone { padding: 0; width: 44px; }
.secao-cabeca { display: flex; justify-content: space-between; align-items: center; gap: var(--okf-space-3);
                margin: var(--okf-space-6) 0 var(--okf-space-3); }
.cartao .secao-cabeca { margin-top: 0; }
.secao-titulo { font: var(--okf-font-heading); font-size: 20px; }
.ao-vivo { display: inline-flex; align-items: center; gap: 6px; font: var(--okf-font-caption); color: var(--okf-verde-strong); }
.ao-vivo::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--okf-verde); }
.grade-hoje, .grade-agenda { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: var(--okf-space-6); align-items: start; }
.grade-hoje .col-principal > section:first-child .secao-cabeca { margin-top: 0; }
.col-lateral { display: flex; flex-direction: column; gap: var(--okf-space-4); }

.faixa-onde { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--okf-space-4); }
.onde { display: flex; align-items: center; gap: var(--okf-space-3); padding: var(--okf-space-4); }
.onde > div { flex: 1; min-width: 0; }
.onde h3 { font: var(--okf-font-heading); font-size: 18px; }
.onde p { margin: 2px 0 0; color: var(--okf-ink-muted); font: var(--okf-font-caption); font-size: 13px; }
.selo-verde { background: var(--okf-verde-soft); color: var(--okf-verde-strong); }
.selo-coral { background: var(--okf-coral-soft); color: var(--okf-coral-strong); }
.selo-azul { background: var(--okf-azul-soft); color: var(--okf-azul); }
.selo-alto { flex-direction: column; border-radius: var(--okf-radius-md); padding: 8px 14px; text-align: center; line-height: 1.25;
             cursor: default; }

.colunas-dia { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--okf-space-4); }
.coluna-crianca { padding: var(--okf-space-4) var(--okf-space-4) var(--okf-space-2); }
.coluna-crianca h3 { display: flex; align-items: center; gap: 8px; font: var(--okf-font-heading); padding-bottom: var(--okf-space-3);
                     border-bottom: 1px solid var(--okf-line); }
.ponto-sol { width: 10px; height: 10px; border-radius: 50%; background: var(--okf-sol); }
.coluna-crianca ul, .lista-dia, .lista-atividades, .lista-avisos { list-style: none; margin: 0; padding: 0; }
.item-dia { border-bottom: 1px solid var(--okf-line); }
.item-dia:last-child { border-bottom: 0; }
.item-dia > button { display: flex; width: 100%; gap: var(--okf-space-3); align-items: flex-start; padding: var(--okf-space-3) 0;
                     border: 0; background: none; text-align: left; cursor: pointer; }
.item-hora { flex: none; width: 46px; font: var(--okf-font-label); color: var(--okf-ink); }
.item-corpo { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.item-corpo strong { font: var(--okf-font-heading); font-size: 16px; }
.item-corpo small { font: var(--okf-font-caption); font-weight: 600; color: var(--okf-ink-muted); }
.item-dia .selo { flex: none; cursor: inherit; }
.situacao-chegou .item-hora, .situacao-saiu .item-hora, .situacao-feito .item-hora, .situacao-passou .item-hora { color: var(--okf-ink-muted); }
.situacao-cancelado .item-corpo strong { text-decoration: line-through; color: var(--okf-ink-muted); }
.etiqueta-sol { align-self: flex-start; margin-top: 6px; padding: 5px 12px; border-radius: var(--okf-radius-sm);
                background: var(--okf-sol-soft); font: var(--okf-font-caption); font-size: 13px; color: var(--okf-ink); }
.vazio-dia { padding: var(--okf-space-4) 0; }

.mochila, .aviso-sol { display: flex; gap: var(--okf-space-4); align-items: center; margin-top: var(--okf-space-6);
                       padding: var(--okf-space-4) var(--okf-space-6); border-radius: var(--okf-radius-lg); background: var(--okf-sol-soft); }
.aviso-sol { margin-top: var(--okf-space-3); }
.mochila strong, .aviso-sol strong { font: var(--okf-font-heading); }
.mochila p, .aviso-sol p { margin: 2px 0 0; }
.mochila-icone { display: grid; place-items: center; flex: none; width: 52px; height: 52px; border-radius: var(--okf-radius-md);
                 background: var(--okf-sol); color: var(--okf-ink); }
.mochila-icone .ic { width: 26px; height: 26px; }

.lista-avisos li { display: flex; gap: var(--okf-space-3); padding: var(--okf-space-3) 0; border-bottom: 1px solid var(--okf-line); }
.lista-avisos li:last-child { border-bottom: 0; }
.lista-avisos p { margin: 0; font: var(--okf-font-body); font-size: 14px; }
.lista-avisos small { font: var(--okf-font-caption); color: var(--okf-ink-muted); }
.avatar-mini { width: 36px; height: 36px; font-size: 14px; }
.linha-2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--okf-space-3); }

/* calendário */
.filtro { margin-bottom: var(--okf-space-4); }
.calendario { padding: var(--okf-space-4); }
.cal-semana, .cal-dias { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.cal-semana span { text-align: center; font: var(--okf-font-caption); text-transform: uppercase; letter-spacing: .05em;
                   color: var(--okf-ink-muted); padding-bottom: var(--okf-space-2); }
.cal-dia { display: flex; flex-direction: column; gap: 3px; min-height: 104px; padding: 6px; border: 1px solid var(--okf-line);
           border-radius: var(--okf-radius-sm); background: var(--okf-surface-raised); text-align: left; cursor: pointer; overflow: hidden; }
.cal-dia:hover { border-color: var(--okf-azul); }
.cal-dia.fora { opacity: .45; }
.cal-dia.hoje .cal-num { background: var(--okf-petroleo); color: var(--okf-on-petroleo); }
.cal-dia.escolhido { box-shadow: inset 0 0 0 2px var(--okf-azul); border-color: var(--okf-azul); }
.cal-num { align-self: flex-start; min-width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%;
           font: var(--okf-font-label); }
.cal-item { display: block; padding: 2px 6px; border-radius: 6px; background: var(--okf-azul-soft); font: var(--okf-font-caption);
            font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal-item.cancelado { background: var(--okf-surface-sunken); text-decoration: line-through; color: var(--okf-ink-muted); }
.cal-mais { font: var(--okf-font-caption); font-size: 11px; color: var(--okf-ink-muted); }
.lista-atividades li button { display: flex; flex-direction: column; gap: 2px; width: 100%; padding: var(--okf-space-3) 0; border: 0;
                              border-bottom: 1px solid var(--okf-line); background: none; text-align: left; cursor: pointer; }
.lista-atividades li:last-child button { border-bottom: 0; }
.lista-atividades button:disabled { cursor: default; }
.lista-atividades strong { font: var(--okf-font-label); font-size: 15px; }
.lista-atividades small { font: var(--okf-font-caption); color: var(--okf-ink-muted); }
.chip input[type=radio] { position: absolute; opacity: 0; width: 1px; height: 1px; }
.chip-sol:has(input[type=radio]:checked) { background: var(--okf-sol-soft); box-shadow: inset 0 0 0 2px var(--okf-sol); }

@media (max-width: 1180px) {
  .grade-hoje, .grade-agenda { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .cal-dia { min-height: 64px; }
  .cal-item { display: none; }
  .cal-dia:has(.cal-item)::after { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--okf-azul); }
  .linha-2 { grid-template-columns: 1fr; }
}
