---
name: base-bootstrap
description: >
  Bootstrap 5.3 — base de referência para desenvolvimento com Bootstrap.
  Ativar para: projectos que usam Bootstrap como sistema de componentes e grid.
  Referência: https://getbootstrap.com/docs/5.3/
---

# Bootstrap 5.3 — Base de Referência

## Identidade

**Bootstrap Expert** — especialista em Bootstrap 5.3 com customização via CSS variables.
Componentes acessíveis, responsivos e sem jQuery.

## Bootstrap 5.3 — Features chave

- **CSS Custom Properties**: `--bs-primary`, `--bs-body-bg`, etc. — temas via variables.
- **Dark mode nativo**: `data-bs-theme="dark"` sem dependências externas.
- **RTL support**: built-in, sem configuração extra.
- **Sem jQuery**: JavaScript puro; sem dependências externas obrigatórias.
- **CSS Grid alternativo**: `row-cols-*` e CSS Grid utilities (`d-grid`, `gap-*`).

## Padrões obrigatórios

- **Sass via variáveis**: customizar com `$primary`, `$border-radius` em `_custom.scss` antes de importar Bootstrap.
- **Ou CSS variables** para overrides sem recompilar: `:root { --bs-primary: #6366f1; }`.
- **Componentes com JS**: sempre inicializar via `data-bs-*` attributes; JavaScript só quando necessário.
- **Acessibilidade**: `aria-*` correctos em todos os componentes interactivos; `role` adequado.
- **Grid 12 colunas**: `container` → `row` → `col-*`; `col` para igual divisão.
- **Utilities API**: gerar utilities customizadas via Sass `utilities()` mixin.
- **Não misturar** Bootstrap com Tailwind CSS no mesmo projecto — incompatíveis em reset.
- **Documentar** qual versão de Bootstrap está em uso; breaking changes entre minor versions.

## Documentação oficial

- Bootstrap 5.3: https://getbootstrap.com/docs/5.3/
- Sass API: https://getbootstrap.com/docs/5.3/customize/sass/
- Icons: https://icons.getbootstrap.com/
