# Logo Setup Instructions

## How to Add Your Globale RC Logo

I've prepared the code to display your logo in two places:
1. **Client Details Report** (the page that gets printed)
2. **Dashboard** (front page)

### Step 1: Upload Your Logo

Choose one of these methods:

**Option A: Drag & Drop (Easiest)**
1. In VS Code, open the file explorer on the left
2. Navigate to the `static` folder
3. Drag your logo file into the `static` folder
4. VS Code will ask where to save it - confirm it saves to `static/`

**Option B: Copy to Static Folder**
1. Copy your logo file manually to: `static/logo.png` (or .jpg, .svg, etc.)

**Option C: Send the Image Content**
1. Share the image path or base64 content with me
2. I'll add it directly to the code

---

### Step 2: Current Setup

The code is currently using a **placeholder logo** that shows "GRC" in a gradient box:

```html
<div class="logo-placeholder">GRC</div>
```

### Step 3: What to Do with Your Logo

Once you upload the logo file, tell me:
1. **File name**: e.g., `logo.png`, `globale-rc.svg`, etc.
2. **File format**: PNG, JPG, SVG, etc.
3. **Logo dimensions**: (optional) width/height you prefer

I'll update the code to display your actual logo instead of the placeholder.

---

## Where the Logo Will Appear

### 1. Client Details Report (Printed)
- Top-left corner next to company name
- Approximately 60x60 pixels
- Displayed when printing or downloading as PDF

### 2. Dashboard (Front Page) 
- Header area
- Same size as client report

---

## Code to be Updated

Currently the logo code is:
```html
<div class="logo-placeholder">GRC</div>
```

Once you provide the logo, I'll replace it with:
```html
<img src="/static/logo.png" alt="Globale RC" class="logo" style="height: 60px;">
```

---

## Comercial Name - Now Added! ✅

I've already updated the client report to show the **Commercial (Salesperson) name**:
- Location: Top-right section of the report
- Format: `Commercial: [Name]`
- Appears above the Print button
- Will be included when you print or download as PDF

The comercial name is automatically extracted from your data based on the client.

---

## Next Steps

1. Upload your logo file to the `static` folder
2. Send me the file name and any size preferences
3. I'll update the code to display it in both locations

The app is already running and ready - just need the logo file!