/* Escola (Fase 7 · mobile 12 no web) e os cartões da coluna do Hoje (web 02). Só tokens.
   A carteirinha estudantil usa a mesma base da de saúde (.carteirinha, em saude.css). */
.cart-estudantil .cart-topo .ic { width: 26px; height: 26px; flex: none; }
.cart-estudantil .cart-rotulo { flex: 1; min-width: 0; }
.cart-crianca { display: flex; align-items: center; gap: var(--okf-space-3); }
.cart-crianca h3 { font: var(--okf-font-title); font-size: 26px; line-height: 1.1; }
.cart-crianca p { margin: 2px 0 0; font: var(--okf-font-body); font-weight: 700; color: color-mix(in srgb, var(--cart-texto) 80%, transparent); }
.notas { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: var(--okf-space-3); }
.nota-materia { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 12px 8px; border-radius: var(--okf-radius-md);
  background: color-mix(in srgb, var(--cart-texto) 10%, transparent); }
.nota-materia small { font: var(--okf-font-label); color: color-mix(in srgb, var(--cart-texto) 80%, transparent); }
.nota-materia strong { font: 600 32px/1.1 var(--okf-family-display); color: var(--cart-texto); }
.cart-rodape { font: var(--okf-font-body); font-weight: 700; }
.cart-rodape button { border: 0; background: none; padding: 0; color: inherit; font: inherit; font-weight: 800; text-decoration: underline;
  text-underline-offset: 3px; cursor: pointer; }
.cart-vazia { font: var(--okf-font-body); color: color-mix(in srgb, var(--cart-texto) 80%, transparent); }

.grade-escola { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: var(--okf-space-6); margin-top: var(--okf-space-6); align-items: start; }
.grade-escola > .cartao, .grade-escola .col-lateral > .cartao { padding: var(--okf-space-6); }
.lista-escola > li > button.linha { display: flex; align-items: center; gap: var(--okf-space-3); width: 100%; padding: 0; border: 0; background: none;
  text-align: left; font: inherit; color: inherit; cursor: pointer; }
.lista-escola .data-bloco.prova { background: var(--okf-vermelho-soft); color: var(--okf-vermelho); }
.lista-escola .data-bloco.prova strong { color: var(--okf-ink); }
.lista-escola .data-bloco.feito { background: var(--okf-verde-soft); color: var(--okf-verde-strong); }
.lista-escola .data-bloco.feito strong { color: var(--okf-ink); }
.lista-escola .data-bloco.aniversario { background: var(--okf-coral-soft); color: var(--okf-coral-strong); }
.lista-escola .data-bloco.aniversario strong { color: var(--okf-ink); }
.lista-escola .data-bloco.reuniao { background: var(--okf-azul-soft); color: var(--okf-azul); }
.lista-escola .data-bloco.reuniao strong { color: var(--okf-ink); }
.lista-escola .presente { flex: none; color: var(--okf-coral-strong); }
.lista-escola .presente .ic { width: 26px; height: 26px; }
.selo-vermelho { background: var(--okf-vermelho-soft); color: var(--okf-vermelho); }
.selo-sol { background: var(--okf-sol-soft); color: var(--okf-ink); }
.painel-lista .quem-crianca { font-weight: 800; color: var(--okf-ink); }
.painel-rodape .link { width: auto; }

/* "Estudar junto faz diferença" */
.estudar { display: flex; gap: var(--okf-space-4); padding: var(--okf-space-6); border-radius: var(--okf-radius-lg); background: var(--okf-verde-soft); }
.estudar + .estudar { margin-top: var(--okf-space-4); }
.estudar-icone { display: grid; place-items: center; flex: none; width: 52px; height: 52px; border-radius: var(--okf-radius-md);
  background: var(--okf-verde-strong); color: var(--okf-on-petroleo); }
.estudar h3 { font: var(--okf-font-heading); margin-bottom: 4px; }
.estudar p { margin: 0 0 var(--okf-space-3); font: var(--okf-font-body); }
.estudar p:last-child { margin-bottom: 0; }

/* Hoje (web 02): semana da guarda e a prova da semana */
.cartao-semana { display: flex; align-items: center; gap: var(--okf-space-4); padding: var(--okf-space-4) var(--okf-space-6);
  border-radius: var(--okf-radius-lg); background: var(--okf-azul-soft); color: var(--okf-ink); text-decoration: none; }
.cartao-semana .par { display: flex; flex: none; }
.cartao-semana .par > * + * { margin-left: -12px; }
.cartao-semana div { flex: 1; min-width: 0; }
.cartao-semana strong { display: block; font: var(--okf-font-heading); }
.cartao-semana small { display: block; font: var(--okf-font-label); font-weight: 600; }
.cartao-prova { gap: var(--okf-space-3); padding: var(--okf-space-6); }
.cartao-prova h3 { display: flex; align-items: center; gap: 10px; font: var(--okf-font-heading); }
.cartao-prova h3 .ic { width: 22px; height: 22px; flex: none; }
.cartao-prova p { margin: 0; font: var(--okf-font-body); }
.cartao-prova .btn { align-self: flex-start; background: var(--okf-surface-raised); color: var(--okf-ink); }

/* boletim */
.boletim { width: 100%; border-collapse: collapse; font: var(--okf-font-body); }
.boletim th, .boletim td { padding: 10px 8px; border-bottom: 1px solid var(--okf-line); text-align: center; }
.boletim th:first-child, .boletim td:first-child { text-align: left; }
.boletim thead th { font: var(--okf-font-label); color: var(--okf-ink-muted); }
.boletim tfoot td { font-weight: 800; border-bottom: 0; }
.lanc { list-style: none; margin: 0; padding: 0; }
.lanc li { display: flex; align-items: center; gap: var(--okf-space-3); padding: var(--okf-space-2) 0; border-bottom: 1px solid var(--okf-line); }
.lanc li:last-child { border-bottom: 0; }
.lanc .corpo { flex: 1; min-width: 0; }
.lanc strong { display: block; font: var(--okf-font-heading); font-size: 16px; }
.lanc small { display: block; font: var(--okf-font-caption); font-weight: 600; color: var(--okf-ink-muted); }
.lanc .valor { font: 600 22px/1 var(--okf-family-display); }
.acoes-tarefa { display: flex; flex-direction: column; gap: var(--okf-space-2); }
.acoes-tarefa .btn { width: 100%; justify-content: flex-start; }

@media (max-width: 1180px) {
  .grade-escola { grid-template-columns: 1fr; }
}

/* agenda (web 03): o que é da escola */
.cal-dia .cal-item.cal-escola, .cal-dia[class*="guarda-"] .cal-item.cal-escola { background: var(--okf-sol-soft); color: var(--okf-ink); }
.item-dia > a { display: flex; width: 100%; gap: var(--okf-space-3); align-items: flex-start; padding: var(--okf-space-3) 0;
  color: inherit; text-decoration: none; }
.item-dia > a .selo { flex: none; }