# ==========================================
# Stage 1: Build the CSS using Node.js
# ==========================================
FROM node:20-slim AS css-builder

WORKDIR /build

# Copy package files and install dependencies
COPY package*.json ./
RUN npm install

# Copy your source code (needed if your CSS framework scans HTML/JS for classes, like Tailwind)
COPY . .

# Run your build script
RUN npm run build:css

# ==========================================
# Stage 2: Final Python Image
# ==========================================
FROM python:3.13-slim

WORKDIR /src

# Install Python dependencies
COPY requirements.txt .
RUN pip install --no-cache-dir -r requirements.txt

# Copy the entire project from your host machine
COPY . ./app/

# Overwrite the empty CSS directory with the compiled CSS from Stage 1
# IMPORTANT: Change the paths below to match where your CSS actually gets generated!
# Example: COPY --from=css-builder /build/static/css/style.css ./app/static/css/style.css
COPY --from=css-builder /build/static/css/output.css ./app/static/css/output.css

# Expose Gunicorn port
EXPOSE 5000

# Gunicorn command
CMD ["gunicorn", "-w", "1", "--worker-class", "eventlet", "-b", "0.0.0.0:5000", "app.wsgi:app"]