Aqui está o código refinado. Eu fiz as seguintes melhorias para garantir que os "gráficos" e a visualização fiquem profissionais e funcionais:
* Dashboard Visual (Gráficos CSS): Adicionei uma seção no topo com gráficos circulares (feitos em CSS puro) que mostram o progresso do consumo das férias, banco de horas e folgas.
* Layout em Grade: Os meses agora ficam lado a lado em telas maiores (grid), facilitando a visualização do ano todo sem precisar rolar tanto a página.
* Design Moderno: Melhorei a tipografia, adicionei sombras suaves, bordas arredondadas e badges (etiquetas) coloridas para facilitar a leitura rápida (Home Office, Presencial, Férias).
* Responsividade: O calendário se adapta a celulares e telas grandes.
Basta salvar o código abaixo como um arquivo .html (ex: plano-ferias-2026.html) e abrir no seu navegador.
Calendário 2026 – Plano de Férias
Férias
30 de 30 dias planejados
Status: Completo
Banco de Horas
3 de 3 dias alocados
Prazo: Fev/26
Folgas Flexíveis
5 de 5 dias distribuídos
Ao longo do ano
Resumo do Plano
- Bloco 1 (20 dias): 02/03 a 27/03
- Bloco 2 (5 dias): 22/06 a 26/06
- Bloco 3 (5 dias): 07/12 a 11/12
- Banco de Horas: 18, 19 e 20/02
Legenda Visual
Consumido (Férias/Folgas)
Janeiro 2026
| Seg | Ter | Qua | Qui | Sex | Sáb | Dom |
| | | 1Feriado | 2H.O. | 3 | 4 |
| 5Pres. | 6Pres. | 7H.O. | 8Pres. | 9H.O. | 10 | 11 |
| 12Pres. | 13Pres. | 14H.O. | 15Pres. | 16H.O. | 17 | 18 |
| 19Pres. | 20S. Sebastião | 21H.O. | 22Pres. | 23H.O. | 24 | 25 |
| 26Pres. | 27Pres. | 28H.O. | 29Pres. | 30H.O. | 31 | |
Fevereiro 2026
| Seg | Ter | Qua | Qui | Sex | Sáb | Dom |
| | | | | | 1 |
| 2Pres. | 3Pres. | 4H.O. | 5Pres. | 6H.O. | 7 | 8 |
| 9Pres. | 10Pres. | 11H.O. | 12Pres. | 13H.O. | 14 | 15 |
| 16Carnaval | 17Carnaval | 18BH1 | 19BH2 | 20BH3 | 21 | 22 |
| 23Pres. | 24Pres. | 25H.O. | 26Pres. | 27H.O. | 28 | |
Março 2026
| Seg | Ter | Qua | Qui | Sex | Sáb | Dom |
| | | | | | 1 |
| 2Fér D1 | 3Fér D2 | 4Fér D3 | 5Fér D4 | 6Fér D5 | 7 | 8 |
| 9Fér D6 | 10Fér D7 | 11Fér D8 | 12Fér D9 | 13Fér D10 | 14 | 15 |
| 16Fér D11 | 17Fér D12 | 18Fér D13 | 19Fér D14 | 20Fér D15 | 21 | 22 |
| 23Fér D16 | 24Fér D17 | 25Fér D18 | 26Fér D19 | 27Fér D20 | 28 | 29 |
| 30Pres. | 31Pres. | | | | | |
Abril 2026
| Seg | Ter | Qua | Qui | Sex | Sáb | Dom |
| | 1H.O. | 2Pres. | 3Paixão | 4 | 5 |
| 6Pres. | 7Pres. | 8H.O. | 9Pres. | 10H.O. | 11 | 12 |
| 13Pres. | 14Pres. | 15H.O. | 16Pres. | 17H.O. | 18 | 19 |
| 20DF1 | 21Tirad. | 22DF2 | 23S. Jorge | 24DF3 | 25 | 26 |
| 27Pres. | 28Pres. | 29H.O. | 30Pres. | | | |
Maio 2026
| Seg | Ter | Qua | Qui | Sex | Sáb | Dom |
| | | | 1Trab. | 2 | 3 |
| 4Pres. | 5Pres. | 6H.O. | 7Pres. | 8H.O. | 9 | 10 |
| 11Pres. | 12Pres. | 13H.O. | 14Pres. | 15H.O. | 16 | 17 |
| 18Pres. | 19Pres. | 20H.O. | 21Pres. | 22H.O. | 23 | 24 |
| 25Pres. | 26Pres. | 27H.O. | 28Pres. | 29H.O. | 30 | 31 |
Junho 2026
| Seg | Ter | Qua | Qui | Sex | Sáb | Dom |
| 1Pres. | 2Pres. | 3H.O. | 4Corpus | 5DF4 | 6 | 7 |
| 8Pres. | 9Pres. | 10H.O. | 11Pres. | 12H.O. | 13 | 14 |
| 15Pres. | 16Pres. | 17H.O. | 18Pres. | 19H.O. | 20 | 21 |
| 22Fér D1 | 23Fér D2 | 24Fér D3 | 25Fér D4 | 26Fér D5 | 27 | 28 |
| 29Pres. | 30Pres. | | | | | |
Julho 2026
| Seg | Ter | Qua | Qui | Sex | Sáb | Dom |
| | 1H.O. | 2Pres. | 3H.O. | 4 | 5 |
| 6Pres. | 7Pres. | 8H.O. | 9Pres. | 10H.O. | 11 | 12 |
| 13Pres. | 14Pres. | 15H.O. | 16Pres. | 17H.O. | 18 | 19 |
| 20Pres. | 21Pres. | 22H.O. | 23Pres. | 24H.O. | 25 | 26 |
| 27Pres. | 28Pres. | 29H.O. | 30Pres. | 31H.O. | | |
Agosto 2026
| Seg | Ter | Qua | Qui | Sex | Sáb | Dom |
| | | | | 1 | 2 |
| 3Pres. | 4Pres. | 5H.O. | 6Pres. | 7H.O. | 8 | 9 |
| 10Pres. | 11Pres. | 12H.O. | 13Pres. | 14H.O. | 15 | 16 |
| 17Pres. | 18Pres. | 19H.O. | 20Pres. | 21H.O. | 22 | 23 |
| 24Pres. | 25Pres. | 26H.O. | 27Pres. | 28H.O. | 29 | 30 |
| 31Pres. | | | | | | |
Setembro 2026
| Seg | Ter | Qua | Qui | Sex | Sáb | Dom |
| 1Pres. | 2H.O. | 3Pres. | 4H.O. | 5 | 6 |
| 7Indep. | 8Pres. | 9H.O. | 10Pres. | 11H.O. | 12 | 13 |
| 14Pres. | 15Pres. | 16H.O. | 17Pres. | 18H.O. | 19 | 20 |
| 21Pres. | 22Pres. | 23H.O. | 24Pres. | 25H.O. | 26 | 27 |
| 28Pres. | 29Pres. | 30H.O. | | | | |
Outubro 2026
| Seg | Ter | Qua | Qui | Sex | Sáb | Dom |
| | | 1Pres. | 2H.O. | 3 | 4 |
| 5Pres. | 6Pres. | 7H.O. | 8Pres. | 9H.O. | 10 | 11 |
| 12N. Sra | 13Pres. | 14H.O. | 15Pres. | 16H.O. | 17 | 18 |
| 19Pres. | 20Pres. | 21H.O. | 22Pres. | 23H.O. | 24 | 25 |
| 26Pres. | 27Pres. | 28H.O. | 29Pres. | 30H.O. | 31 | |
Novembro 2026
| Seg | Ter | Qua | Qui | Sex | Sáb | Dom |
| | | | | | 1 |
| 2Finados | 3DF5 | 4H.O. | 5Pres. | 6H.O. | 7 | 8 |
| 9Pres. | 10Pres. | 11H.O. | 12Pres. | 13H.O. | 14 | 15 |
| 16Pres. | 17Pres. | 18H.O. | 19Pres. | 20H.O. | 21 | 22 |
| 23Pres. | 24Pres. | 25H.O. | 26Pres. | 27H.O. | 28 | 29 |
| 30Pres. | | | | | | |
Dezembro 2026
| Seg | Ter | Qua | Qui | Sex | Sáb | Dom |
| 1Pres. | 2H.O. | 3Pres. | 4H.O. | 5 | 6 |
| 7Fér D1 | 8Fér D2 | 9Fér D3 | 10Fér D4 | 11Fér D5 | 12 | 13 |
| 14Pres. | 15Pres. | 16H.O. | 17Pres. | 18H.O. | 19 | 20 |
| 21Pres. | 22Pres. | 23H.O. | 24Pres. | 25Natal | 26 | 27 |
| 28Pres. | 29Pres. | 30H.O. | 31 | | | |