# Project Structure

## File Organization

```
/
├── index.html              # Main application entry point
├── app.js                  # UI logic and navigation
├── calculations.js         # Calculation engine
├── style.css               # Complete design system
├── BD/                     # Material database (CSV)
│   ├── perfis_w.csv
│   ├── perfis_i.csv
│   ├── cantoneiras.csv
│   ├── tubos_circulares.csv
│   ├── tubos_rhs.csv
│   ├── chapas.csv
│   ├── barras.csv
│   ├── eletrodos.csv
│   ├── parafusos.csv
│   └── tintas.csv
├── ORIGINAL/               # Backup of original files
└── aco-calc-pro-v7-5.zip   # Archive
```

## Code Organization

### app.js
- Application state management (`appState`, `adminConfig`)
- Navigation and section switching
- Modal management (history, favorites, admin, help)
- Theme toggling (light/dark)
- Expert mode functionality
- CSV loading and parsing
- Material database (in-memory fallback)
- Content generation functions for each section

### calculations.js
- Calculation functions for all engineering tools
- Result formatting and display
- Chart generation (Charpy curves)
- History tracking
- Input validation

### style.css
- Design system with CSS variables
- Theme support (light/dark modes)
- Responsive layout
- Component styles (buttons, forms, cards, modals)
- Utility classes

## Key Patterns

### Section Loading
Each tool section has a content generator function (e.g., `getCEVContent()`, `getParafusosContent()`) that returns HTML strings dynamically injected into the main content area.

### State Management
Global objects store application state:
- `appState`: Current section, theme, mode, history, favorites, budget items
- `adminConfig`: Branding, tool visibility, preferences

### CSV Data Loading
Materials are loaded from CSV files with fallback to in-memory database:
1. Attempt to fetch CSV from `/BD/` directory
2. Parse CSV into JavaScript objects
3. Fall back to `materialsDatabase` if fetch fails

### Calculation Flow
1. User inputs values in form
2. Calculation function reads inputs
3. Performs calculations following engineering standards
4. Generates formatted result HTML
5. Adds entry to history

## Naming Conventions

- **Functions**: camelCase (e.g., `calcularPreaquecimento`, `showSection`)
- **Variables**: camelCase (e.g., `currentChart`, `appState`)
- **CSS Classes**: kebab-case (e.g., `sidebar-item`, `result-box`)
- **IDs**: kebab-case (e.g., `main-content`, `history-modal`)
- **Constants**: camelCase for objects (e.g., `steelDatabase`, `regionalPricing`)

## Modular Sections

The application is organized into 6 main categories:
1. **MATERIAIS** (Materials): CEV, steel selector, equivalencies, comparisons
2. **CONEXÕES** (Connections): Bolted connections, drilling layouts, bolt vs weld
3. **SOLDAGEM** (Welding): Preheat, fillet welds, heat input, electrode consumption
4. **ENSAIOS** (Testing): Hardness, Charpy, certificates, ultrasound
5. **PINTURA** (Coating): Area calculation, paint consumption, galvanization, costs
6. **ORÇAMENTO** (Budget): Detailed budgets, weight/rigging, technical references

## Extension Points

To add a new calculation tool:
1. Add sidebar item in `index.html`
2. Create content generator function in `app.js` (e.g., `getNewToolContent()`)
3. Add calculation function in `calculations.js`
4. Add section case to `loadSectionContent()` switch
5. Update `adminConfig.toolsVisibility` if needed