<form method="POST" id="fontSettingsForm">
    <input type="hidden" name="action" value="update_font_settings">
    
    <div class="alert alert-info mt-2 mb-3">
        <i class="fas fa-info-circle mr-2"></i>
        <strong>Font Settings:</strong> Customize fonts, sizes, and colors for different sections of your invoice. Changes will apply to all future invoices.
    </div>
    
    <h5 class="text-primary mb-3">
        <i class="fas fa-building mr-2"></i>Company Header
    </h5>
    
    <div class="row">
        <!-- Company Name Font -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="companyNameFont">Company Name Font</label>
                <select class="form-control" id="companyNameFont" name="companyNameFont" required>
                    <?php foreach ($availableFonts as $font): ?>
                    <option value="<?php echo $font; ?>" <?php echo ($fontSettings && $fontSettings['CompanyNameFont'] == $font) ? 'selected' : ''; ?>>
                        <?php echo $font; ?>
                    </option>
                    <?php endforeach; ?>
                </select>
            </div>
        </div>
        
        <!-- Company Name Size -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="companyNameSize">Size (px)</label>
                <input type="number" class="form-control" id="companyNameSize" name="companyNameSize" 
                       min="10" max="50" value="<?php echo $fontSettings['CompanyNameSize'] ?? 20; ?>" required>
            </div>
        </div>
        
        <!-- Company Name Color -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="companyNameColor">Color</label>
                <input type="color" class="form-control" id="companyNameColor" name="companyNameColor" 
                       value="<?php echo $fontSettings['CompanyNameColor'] ?? '#000000'; ?>" required>
            </div>
        </div>
        
        <!-- Company Name Weight -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="companyNameWeight">Weight</label>
                <select class="form-control" id="companyNameWeight" name="companyNameWeight" required>
                    <option value="normal" <?php echo ($fontSettings && $fontSettings['CompanyNameWeight'] == 'normal') ? 'selected' : ''; ?>>Normal</option>
                    <option value="bold" <?php echo ($fontSettings && $fontSettings['CompanyNameWeight'] == 'bold') ? 'selected' : ''; ?>>Bold</option>
                </select>
            </div>
        </div>
    </div>
    
    <div class="row">
        <!-- Address Font -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="addressFont">Address Font</label>
                <select class="form-control" id="addressFont" name="addressFont" required>
                    <?php foreach ($availableFonts as $font): ?>
                    <option value="<?php echo $font; ?>" <?php echo ($fontSettings && $fontSettings['AddressFont'] == $font) ? 'selected' : ''; ?>>
                        <?php echo $font; ?>
                    </option>
                    <?php endforeach; ?>
                </select>
            </div>
        </div>
        
        <!-- Address Size -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="addressSize">Size (px)</label>
                <input type="number" class="form-control" id="addressSize" name="addressSize" 
                       min="8" max="20" value="<?php echo $fontSettings['AddressSize'] ?? 10; ?>" required>
            </div>
        </div>
        
        <!-- Address Color -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="addressColor">Color</label>
                <input type="color" class="form-control" id="addressColor" name="addressColor" 
                       value="<?php echo $fontSettings['AddressColor'] ?? '#000000'; ?>" required>
            </div>
        </div>
        
        <!-- Address Weight -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="addressWeight">Weight</label>
                <select class="form-control" id="addressWeight" name="addressWeight" required>
                    <option value="normal" <?php echo ($fontSettings && $fontSettings['AddressWeight'] == 'normal') ? 'selected' : ''; ?>>Normal</option>
                    <option value="bold" <?php echo ($fontSettings && $fontSettings['AddressWeight'] == 'bold') ? 'selected' : ''; ?>>Bold</option>
                </select>
            </div>
        </div>
    </div>
    
    <div class="row">
        <!-- Contact Font -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="contactFont">Contact Details Font</label>
                <select class="form-control" id="contactFont" name="contactFont" required>
                    <?php foreach ($availableFonts as $font): ?>
                    <option value="<?php echo $font; ?>" <?php echo ($fontSettings && $fontSettings['ContactFont'] == $font) ? 'selected' : ''; ?>>
                        <?php echo $font; ?>
                    </option>
                    <?php endforeach; ?>
                </select>
            </div>
        </div>
        
        <!-- Contact Size -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="contactSize">Size (px)</label>
                <input type="number" class="form-control" id="contactSize" name="contactSize" 
                       min="8" max="20" value="<?php echo $fontSettings['ContactSize'] ?? 10; ?>" required>
            </div>
        </div>
        
        <!-- Contact Color -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="contactColor">Color</label>
                <input type="color" class="form-control" id="contactColor" name="contactColor" 
                       value="<?php echo $fontSettings['ContactColor'] ?? '#000000'; ?>" required>
            </div>
        </div>
        
        <!-- Contact Weight -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="contactWeight">Weight</label>
                <select class="form-control" id="contactWeight" name="contactWeight" required>
                    <option value="normal" <?php echo ($fontSettings && $fontSettings['ContactWeight'] == 'normal') ? 'selected' : ''; ?>>Normal</option>
                    <option value="bold" <?php echo ($fontSettings && $fontSettings['ContactWeight'] == 'bold') ? 'selected' : ''; ?>>Bold</option>
                </select>
            </div>
        </div>
    </div>
    
    <hr class="my-4">
    
    <h5 class="text-primary mb-3">
        <i class="fas fa-file-invoice mr-2"></i>Invoice Title
    </h5>
    
    <div class="row">
        <!-- Invoice Title Font -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="invoiceTitleFont">Invoice Title Font</label>
                <select class="form-control" id="invoiceTitleFont" name="invoiceTitleFont" required>
                    <?php foreach ($availableFonts as $font): ?>
                    <option value="<?php echo $font; ?>" <?php echo ($fontSettings && $fontSettings['InvoiceTitleFont'] == $font) ? 'selected' : ''; ?>>
                        <?php echo $font; ?>
                    </option>
                    <?php endforeach; ?>
                </select>
            </div>
        </div>
        
        <!-- Invoice Title Size -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="invoiceTitleSize">Size (px)</label>
                <input type="number" class="form-control" id="invoiceTitleSize" name="invoiceTitleSize" 
                       min="10" max="30" value="<?php echo $fontSettings['InvoiceTitleSize'] ?? 16; ?>" required>
            </div>
        </div>
        
        <!-- Invoice Title Color -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="invoiceTitleColor">Color</label>
                <input type="color" class="form-control" id="invoiceTitleColor" name="invoiceTitleColor" 
                       value="<?php echo $fontSettings['InvoiceTitleColor'] ?? '#000000'; ?>" required>
            </div>
        </div>
        
        <!-- Invoice Title Weight -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="invoiceTitleWeight">Weight</label>
                <select class="form-control" id="invoiceTitleWeight" name="invoiceTitleWeight" required>
                    <option value="normal" <?php echo ($fontSettings && $fontSettings['InvoiceTitleWeight'] == 'normal') ? 'selected' : ''; ?>>Normal</option>
                    <option value="bold" <?php echo ($fontSettings && $fontSettings['InvoiceTitleWeight'] == 'bold') ? 'selected' : ''; ?>>Bold</option>
                </select>
            </div>
        </div>
    </div>
    
    <hr class="my-4">
    
    <h5 class="text-primary mb-3">
        <i class="fas fa-heading mr-2"></i>Section Titles
    </h5>
    
    <div class="row">
        <!-- Section Title Font -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="sectionTitleFont">Section Title Font (Bill To, Ship To, etc.)</label>
                <select class="form-control" id="sectionTitleFont" name="sectionTitleFont" required>
                    <?php foreach ($availableFonts as $font): ?>
                    <option value="<?php echo $font; ?>" <?php echo ($fontSettings && $fontSettings['SectionTitleFont'] == $font) ? 'selected' : ''; ?>>
                        <?php echo $font; ?>
                    </option>
                    <?php endforeach; ?>
                </select>
            </div>
        </div>
        
        <!-- Section Title Size -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="sectionTitleSize">Size (px)</label>
                <input type="number" class="form-control" id="sectionTitleSize" name="sectionTitleSize" 
                       min="8" max="20" value="<?php echo $fontSettings['SectionTitleSize'] ?? 11; ?>" required>
            </div>
        </div>
        
        <!-- Section Title Color -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="sectionTitleColor">Color</label>
                <input type="color" class="form-control" id="sectionTitleColor" name="sectionTitleColor" 
                       value="<?php echo $fontSettings['SectionTitleColor'] ?? '#000000'; ?>" required>
            </div>
        </div>
        
        <!-- Section Title Weight -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="sectionTitleWeight">Weight</label>
                <select class="form-control" id="sectionTitleWeight" name="sectionTitleWeight" required>
                    <option value="normal" <?php echo ($fontSettings && $fontSettings['SectionTitleWeight'] == 'normal') ? 'selected' : ''; ?>>Normal</option>
                    <option value="bold" <?php echo ($fontSettings && $fontSettings['SectionTitleWeight'] == 'bold') ? 'selected' : ''; ?>>Bold</option>
                </select>
            </div>
        </div>
    </div>
    
    <hr class="my-4">
    
    <h5 class="text-primary mb-3">
        <i class="fas fa-table mr-2"></i>Product Table
    </h5>
    
    <div class="row">
        <!-- Table Header Font -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="tableHeaderFont">Table Header Font</label>
                <select class="form-control" id="tableHeaderFont" name="tableHeaderFont" required>
                    <?php foreach ($availableFonts as $font): ?>
                    <option value="<?php echo $font; ?>" <?php echo ($fontSettings && $fontSettings['TableHeaderFont'] == $font) ? 'selected' : ''; ?>>
                        <?php echo $font; ?>
                    </option>
                    <?php endforeach; ?>
                </select>
            </div>
        </div>
        
        <!-- Table Header Size -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="tableHeaderSize">Size (px)</label>
                <input type="number" class="form-control" id="tableHeaderSize" name="tableHeaderSize" 
                       min="8" max="20" value="<?php echo $fontSettings['TableHeaderSize'] ?? 10; ?>" required>
            </div>
        </div>
        
        <!-- Table Header Color -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="tableHeaderColor">Text Color</label>
                <input type="color" class="form-control" id="tableHeaderColor" name="tableHeaderColor" 
                       value="<?php echo $fontSettings['TableHeaderColor'] ?? '#000000'; ?>" required>
            </div>
        </div>
        
        <!-- Table Header Weight -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="tableHeaderWeight">Weight</label>
                <select class="form-control" id="tableHeaderWeight" name="tableHeaderWeight" required>
                    <option value="normal" <?php echo ($fontSettings && $fontSettings['TableHeaderWeight'] == 'normal') ? 'selected' : ''; ?>>Normal</option>
                    <option value="bold" <?php echo ($fontSettings && $fontSettings['TableHeaderWeight'] == 'bold') ? 'selected' : ''; ?>>Bold</option>
                </select>
            </div>
        </div>
    </div>
    
    <div class="row">
        <!-- Table Header Background Color -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="tableHeaderBgColor">Header Background Color</label>
                <input type="color" class="form-control" id="tableHeaderBgColor" name="tableHeaderBgColor" 
                       value="<?php echo $fontSettings['TableHeaderBgColor'] ?? '#f0f0f0'; ?>" required>
            </div>
        </div>
    </div>
    
    <div class="row">
        <!-- Table Body Font -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="tableBodyFont">Table Body Font</label>
                <select class="form-control" id="tableBodyFont" name="tableBodyFont" required>
                    <?php foreach ($availableFonts as $font): ?>
                    <option value="<?php echo $font; ?>" <?php echo ($fontSettings && $fontSettings['TableBodyFont'] == $font) ? 'selected' : ''; ?>>
                        <?php echo $font; ?>
                    </option>
                    <?php endforeach; ?>
                </select>
            </div>
        </div>
        
        <!-- Table Body Size -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="tableBodySize">Size (px)</label>
                <input type="number" class="form-control" id="tableBodySize" name="tableBodySize" 
                       min="8" max="20" value="<?php echo $fontSettings['TableBodySize'] ?? 10; ?>" required>
            </div>
        </div>
        
        <!-- Table Body Color -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="tableBodyColor">Color</label>
                <input type="color" class="form-control" id="tableBodyColor" name="tableBodyColor" 
                       value="<?php echo $fontSettings['TableBodyColor'] ?? '#000000'; ?>" required>
            </div>
        </div>
        
        <!-- Table Body Weight -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="tableBodyWeight">Weight</label>
                <select class="form-control" id="tableBodyWeight" name="tableBodyWeight" required>
                    <option value="normal" <?php echo ($fontSettings && $fontSettings['TableBodyWeight'] == 'normal') ? 'selected' : ''; ?>>Normal</option>
                    <option value="bold" <?php echo ($fontSettings && $fontSettings['TableBodyWeight'] == 'bold') ? 'selected' : ''; ?>>Bold</option>
                </select>
            </div>
        </div>
    </div>
    
    <hr class="my-4">
    
    <h5 class="text-primary mb-3">
        <i class="fas fa-file-alt mr-2"></i>Declaration & Footer
    </h5>
    
    <div class="row">
        <!-- Declaration Font -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="declarationFont">Declaration Font</label>
                <select class="form-control" id="declarationFont" name="declarationFont" required>
                    <?php foreach ($availableFonts as $font): ?>
                    <option value="<?php echo $font; ?>" <?php echo ($fontSettings && $fontSettings['DeclarationFont'] == $font) ? 'selected' : ''; ?>>
                        <?php echo $font; ?>
                    </option>
                    <?php endforeach; ?>
                </select>
            </div>
        </div>
        
        <!-- Declaration Size -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="declarationSize">Size (px)</label>
                <input type="number" class="form-control" id="declarationSize" name="declarationSize" 
                       min="8" max="20" value="<?php echo $fontSettings['DeclarationSize'] ?? 9; ?>" required>
            </div>
        </div>
        
        <!-- Declaration Color -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="declarationColor">Color</label>
                <input type="color" class="form-control" id="declarationColor" name="declarationColor" 
                       value="<?php echo $fontSettings['DeclarationColor'] ?? '#000000'; ?>" required>
            </div>
        </div>
        
        <!-- Declaration Weight -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="declarationWeight">Weight</label>
                <select class="form-control" id="declarationWeight" name="declarationWeight" required>
                    <option value="normal" <?php echo ($fontSettings && $fontSettings['DeclarationWeight'] == 'normal') ? 'selected' : ''; ?>>Normal</option>
                    <option value="bold" <?php echo ($fontSettings && $fontSettings['DeclarationWeight'] == 'bold') ? 'selected' : ''; ?>>Bold</option>
                </select>
            </div>
        </div>
    </div>
    
    <div class="row">
        <!-- Footer Font -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="footerFont">Footer Font (Thank You message)</label>
                <select class="form-control" id="footerFont" name="footerFont" required>
                    <?php foreach ($availableFonts as $font): ?>
                    <option value="<?php echo $font; ?>" <?php echo ($fontSettings && $fontSettings['FooterFont'] == $font) ? 'selected' : ''; ?>>
                        <?php echo $font; ?>
                    </option>
                    <?php endforeach; ?>
                </select>
            </div>
        </div>
        
        <!-- Footer Size -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="footerSize">Size (px)</label>
                <input type="number" class="form-control" id="footerSize" name="footerSize" 
                       min="8" max="20" value="<?php echo $fontSettings['FooterSize'] ?? 11; ?>" required>
            </div>
        </div>
        
        <!-- Footer Color -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="footerColor">Color</label>
                <input type="color" class="form-control" id="footerColor" name="footerColor" 
                       value="<?php echo $fontSettings['FooterColor'] ?? '#000000'; ?>" required>
            </div>
        </div>
        
        <!-- Footer Weight -->
        <div class="col-md-3">
            <div class="form-group">
                <label for="footerWeight">Weight</label>
                <select class="form-control" id="footerWeight" name="footerWeight" required>
                    <option value="normal" <?php echo ($fontSettings && $fontSettings['FooterWeight'] == 'normal') ? 'selected' : ''; ?>>Normal</option>
                    <option value="bold" <?php echo ($fontSettings && $fontSettings['FooterWeight'] == 'bold') ? 'selected' : ''; ?>>Bold</option>
                </select>
            </div>
        </div>
    </div>
    
    <div class="alert alert-warning mt-3">
        <i class="fas fa-exclamation-triangle mr-2"></i>
        <strong>Note:</strong> Font settings will apply to all new invoices. Changes may affect the layout of the invoice. 
        Recommended font sizes are already set. Adjust with caution.
    </div>
    
    <div class="form-group mt-4">
        <button type="submit" class="btn btn-primary btn-lg btn-block">
            <i class="fas fa-save mr-2"></i>Save Font Settings
        </button>
    </div>
</form>
