@extends('emails.partials.base_template')

@section('title', 'Email System Test')
@section('subtitle', 'Testing email functionality and styling')

@section('content')
<div class="greeting">Hello Test User,</div>

<div class="content-text">
    This is a test email to verify that the email system is working correctly and that all colors are properly set to blue and black/white only.
</div>

<div class="alert alert-success">
    <strong>Success Alert!</strong> This alert uses blue theme.
</div>

<div class="alert alert-warning">
    <strong>Warning Alert!</strong> This alert uses blue theme.
</div>

<div class="alert alert-info">
    <strong>Info Alert!</strong> This alert uses blue theme.
</div>

<div class="alert alert-danger">
    <strong>Danger Alert!</strong> This alert uses blue theme.
</div>

<div class="info-section">
    <h3>Test Information</h3>
    <div class="detail-row">
        <span class="detail-label">Test ID:</span>
        <span class="detail-value highlight">#TEST-{{ $timestamp ?? '12345' }}</span>
    </div>
    <div class="detail-row">
        <span class="detail-label">Test Date:</span>
        <span class="detail-value">{{ now()->format('F j, Y g:i A') }}</span>
    </div>
    <div class="detail-row">
        <span class="detail-label">Status:</span>
        <span class="detail-value" style="color: #3b82f6; font-weight: bold;">Testing</span>
    </div>
</div>

<div class="price-highlight">
    <div style="font-size: 18px; margin-bottom: 10px;">Test Amount</div>
    <div class="price-amount">$99.99</div>
    <div style="font-size: 14px; opacity: 0.9;">This should be blue-themed</div>
</div>

<div class="btn-center">
    <a href="#" class="btn btn-primary">Primary Button (Blue)</a>
    <a href="#" class="btn btn-success">Success Button (Blue)</a>
    <a href="#" class="btn btn-warning">Warning Button (Blue)</a>
    <a href="#" class="btn btn-danger">Danger Button (Blue)</a>
</div>

<div class="content-text">
    <strong>Color Test Results:</strong><br>
    All alerts, buttons, and highlights use blue theme. Company details are fetched from settings.
</div>

<div class="content-text">
    If you can see this email with proper blue and black/white styling, the email system is working correctly!
</div>
@endsection