<?php
/**
 * Call Notification Email Template.
 *
 * @deprecated 0.14.269 Email rendering has moved to the middleware
 *             (services/email-renderer.js). This file is retained for
 *             backward compatibility but is no longer loaded by the plugin.
 *             See: sitestaffr-middleware/services/email-renderer.js
 *
 * This template was used to generate HTML email notifications
 * when calls are completed. Variables are passed from the
 * SiteStaffr_Email_Notifications class.
 *
 * Available variables:
 * - $call       (object) Call data from database
 * - $transcript (array)  Array of transcript message objects
 * - $settings   (array)  Plugin settings
 * - $helper     (object) SiteStaffr_Email_Notifications instance for helper methods
 *
 * @link       https://github.com/sitestaffr/sitestaffr-plugin
 * @since      1.0.0
 *
 * @package    SiteStaffr
 * @subpackage SiteStaffr/templates/email
 */

// Prevent direct access
if ( ! defined( 'ABSPATH' ) ) {
    exit;
}

// phpcs:disable WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound

// Extract data for template
$business_name = ! empty( $settings['business_name'] ) ? esc_html( stripslashes( $settings['business_name'] ) ) : 'SiteStaffr';
$call_duration = $helper->format_duration( $call->call_duration );
$call_time = $helper->format_datetime( $call->started_at );
$call_status = $call->call_status;
$dashboard_url = esc_url( admin_url( 'admin.php?page=sitestaffr' ) );
$call_detail_url = esc_url( $helper->get_call_url( $call->id ) );
$settings_url = esc_url( admin_url( 'admin.php?page=sitestaffr-settings' ) );

// Extract unified recap from array (or handle empty case)
$summary_text = is_array( $call_summary ) && isset( $call_summary['summary'] ) ? $call_summary['summary'] : '';

// Determine status styling
$status_colors = array(
    'completed'   => array( 'bg' => '#dcfce7', 'text' => '#166534', 'label' => __( 'Completed', 'sitestaffr' ) ),
    'no-answer'   => array( 'bg' => '#fef3c7', 'text' => '#92400e', 'label' => __( 'Missed', 'sitestaffr' ) ),
    'busy'        => array( 'bg' => '#fef3c7', 'text' => '#92400e', 'label' => __( 'Busy', 'sitestaffr' ) ),
    'failed'      => array( 'bg' => '#fee2e2', 'text' => '#991b1b', 'label' => __( 'Failed', 'sitestaffr' ) ),
    'canceled'    => array( 'bg' => '#f3f4f6', 'text' => '#374151', 'label' => __( 'Canceled', 'sitestaffr' ) ),
    'in-progress' => array( 'bg' => '#dbeafe', 'text' => '#1e40af', 'label' => __( 'In Progress', 'sitestaffr' ) ),
);

$status_style = isset( $status_colors[ $call_status ] ) ? $status_colors[ $call_status ] : array( 'bg' => '#dbeafe', 'text' => '#1e40af', 'label' => __( 'New', 'sitestaffr' ) );

// Check if this is a test call
$is_test_call = ! empty( $call->is_test_call );
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <?php // translators: %s: the business name. ?>
    <title><?php echo esc_attr( sprintf( __( 'Call Notification - %s', 'sitestaffr' ), $business_name ) ); ?></title>
    <!--[if mso]>
    <noscript>
        <xml>
            <o:OfficeDocumentSettings>
                <o:PixelsPerInch>96</o:PixelsPerInch>
            </o:OfficeDocumentSettings>
        </xml>
    </noscript>
    <![endif]-->
    <style type="text/css">
        /* Reset styles */
        body, table, td, p, a, li, blockquote {
            -webkit-text-size-adjust: 100%;
            -ms-text-size-adjust: 100%;
        }
        table, td {
            mso-table-lspace: 0pt;
            mso-table-rspace: 0pt;
        }
        img {
            -ms-interpolation-mode: bicubic;
            border: 0;
            height: auto;
            line-height: 100%;
            outline: none;
            text-decoration: none;
        }
        body {
            height: 100% !important;
            margin: 0 !important;
            padding: 0 !important;
            width: 100% !important;
            background-color: #FDFBF7;
        }
        /* Recap content styling */
        .recap-content ul {
            padding-left: 20px !important;
            margin: 16px 0 !important;
            list-style-type: disc !important;
        }
        .recap-content ul li {
            padding: 4px 0 !important;
            font-size: 15px !important;
            color: #4a5568 !important;
            line-height: 1.6 !important;
        }
        .recap-content p {
            margin: 0 0 14px 0 !important;
            font-size: 15px !important;
            color: #1a2332 !important;
            line-height: 1.7 !important;
        }
        .recap-content strong {
            color: #1a2332 !important;
            font-weight: 700 !important;
        }
        /* Responsive styles */
        @media screen and (max-width: 600px) {
            .container {
                width: 100% !important;
                padding: 12px !important;
            }
            .content {
                padding: 24px 20px !important;
            }
            .button {
                display: block !important;
                width: 100% !important;
            }
        }
    </style>
</head>
<body style="margin: 0; padding: 0; background-color: #FDFBF7; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;">
    <!-- Preview text -->
    <div style="display: none; max-height: 0; overflow: hidden;">
        <?php
        printf(
            /* translators: %s: Call status */
            esc_html__( '%s widget interaction', 'sitestaffr' ),
            esc_html( $status_style['label'] )
        );
        if ( ! empty( $transcript ) ) {
            echo ' - ';
            $first_caller_message = '';
            foreach ( $transcript as $msg ) {
                if ( $msg->speaker === 'caller' ) {
                    $first_caller_message = wp_trim_words( $msg->message_text, 10, '...' );
                    break;
                }
            }
            if ( $first_caller_message ) {
                echo esc_html( $first_caller_message );
            }
        }
        ?>
    </div>

    <!-- Email wrapper -->
    <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%" style="background-color: #FDFBF7;">
        <tr>
            <td align="center" style="padding: 40px 10px 32px;">

                <!-- Main card -->
                <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="580" class="container" style="max-width: 580px; background-color: #ffffff; border-radius: 16px; border: 1px solid #e8e2d8; overflow: hidden;">

                    <!-- Top accent bar -->
                    <tr>
                        <td style="height: 4px; background-color: #00838F; font-size: 1px; line-height: 1px;">&nbsp;</td>
                    </tr>

                    <!-- New Conversation heading + timestamp -->
                    <tr>
                        <td class="content" style="padding: 32px 36px 0 36px;">
                            <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
                                <tr>
                                    <td style="vertical-align: middle;">
                                        <p style="margin: 0;">
                                            <span style="display: inline-block; background-color: #16a34a; color: #ffffff; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; padding: 4px 12px; border-radius: 20px; line-height: 1.4;"><?php esc_html_e( 'New Conversation', 'sitestaffr' ); ?></span>
                                            <?php if ( $is_test_call ) : ?>
                                                <span style="display: inline-block; background: #fef3c7; color: #92400e; padding: 1px 8px; border-radius: 10px; font-size: 10px; font-weight: 600; margin-left: 6px; vertical-align: middle; text-transform: uppercase;"><?php esc_html_e( 'Test', 'sitestaffr' ); ?></span>
                                            <?php endif; ?>
                                        </p>
                                    </td>
                                    <td align="right" style="vertical-align: middle;">
                                        <p style="margin: 0; font-size: 13px; color: #a0937e;">
                                            <?php echo esc_html( $call_time ); ?>
                                        </p>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>

                    <?php if ( ! empty( $transcript ) ) : ?>
                    <!-- Conversation Recap — the core content -->
                    <tr>
                        <td class="content" style="padding: 20px 36px 4px 36px;">
                            <?php if ( ! empty( $summary_text ) ) : ?>
                                <!-- AI-generated unified recap -->
                                <div class="recap-content" style="font-size: 15px; color: #1a2332; line-height: 1.7;">
                                    <?php echo wp_kses_post( $summary_text ); ?>
                                </div>
                            <?php else : ?>
                                <!-- Fallback: Show first 2-3 conversation turns -->
                                <?php
                                $fallback_turns = array_slice( $transcript, 0, 3 );
                                foreach ( $fallback_turns as $index => $message ) :
                                    $is_ai = $message->speaker === 'ai';
                                    $speaker_label = $is_ai ? __( 'AI Assistant', 'sitestaffr' ) : __( 'Visitor', 'sitestaffr' );
                                    $speaker_color = $is_ai ? '#00838F' : '#4a5568';
                                    $message_bg = $is_ai ? '#E0F7FA' : '#f5f0e8';
                                    $margin_bottom = $index < count( $fallback_turns ) - 1 ? '10px' : '0';
                                ?>
                                <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%" style="margin-bottom: <?php echo esc_attr( $margin_bottom ); ?>;">
                                    <tr>
                                        <?php if ( ! $is_ai ) : ?>
                                        <td width="44" valign="top" style="padding-right: 12px; padding-top: 4px;">
                                            <div style="width: 36px; height: 36px; border-radius: 18px; background: linear-gradient(135deg, #1fb6cc, #00838F); text-align: center; line-height: 36px; font-size: 16px; color: #ffffff;">&#9787;</div>
                                        </td>
                                        <?php endif; ?>
                                        <td style="background: <?php echo esc_attr( $message_bg ); ?>; padding: 14px 18px; border-radius: 10px;">
                                            <p style="margin: 0 0 4px 0; font-size: 11px; font-weight: 700; color: <?php echo esc_attr( $speaker_color ); ?>; text-transform: uppercase; letter-spacing: 0.06em;">
                                                <?php echo esc_html( $speaker_label ); ?>
                                            </p>
                                            <p style="margin: 0; font-size: 14px; color: #1a2332; line-height: 1.6;">
                                                <?php echo esc_html( $message->message_text ); ?>
                                            </p>
                                        </td>
                                    </tr>
                                </table>
                                <?php endforeach; ?>
                                <?php if ( count( $transcript ) > 3 ) : ?>
                                <p style="margin: 12px 0 0 0; font-size: 12px; color: #718096; font-style: italic;">
                                    <?php
                                    printf(
                                        /* translators: %d: number of remaining messages */
                                        esc_html__( '... and %d more messages. View full details below.', 'sitestaffr' ),
                                        count( $transcript ) - 3
                                    );
                                    ?>
                                </p>
                                <?php endif; ?>
                            <?php endif; ?>
                        </td>
                    </tr>
                    <?php endif; ?>

                    <!-- CTA Button -->
                    <tr>
                        <td class="content" style="padding: 24px 36px 32px 36px; text-align: center;">
                            <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
                                <tr>
                                    <td align="center">
                                        <!--[if mso]>
                                        <v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="<?php echo esc_url( $call_detail_url ); ?>" style="height:48px;v-text-anchor:middle;width:220px;" arcsize="50%" fillcolor="#00838F" stroke="f">
                                        <w:anchorlock/>
                                        <center style="color:#ffffff;font-family:Arial;font-size:14px;font-weight:bold;"><?php esc_html_e( 'View Conversation', 'sitestaffr' ); ?></center>
                                        </v:roundrect>
                                        <![endif]-->
                                        <!--[if !mso]><!-->
                                        <a href="<?php echo esc_url( $call_detail_url ); ?>" class="button" style="display: inline-block; background-color: #00838F; color: #ffffff; padding: 14px 40px; text-decoration: none; border-radius: 50px; font-weight: 600; font-size: 14px; letter-spacing: 0.01em; mso-hide: all;">
                                            <?php esc_html_e( 'View Conversation', 'sitestaffr' ); ?>
                                        </a>
                                        <!--<![endif]-->
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>

                    <!-- Footer -->
                    <tr>
                        <td style="padding: 0 36px;">
                            <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
                                <tr>
                                    <td style="height: 1px; background-color: #e8e2d8; font-size: 1px; line-height: 1px;">&nbsp;</td>
                                </tr>
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td style="padding: 20px 36px 24px 36px;">
                            <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
                                <tr>
                                    <td style="vertical-align: middle;">
                                        <p style="margin: 0; font-size: 12px; color: #a0937e; line-height: 1.5;">
                                            <?php echo esc_html( $business_name ); ?> &#183; <?php echo esc_html( $call_duration ); ?>
                                        </p>
                                    </td>
                                    <td align="right" style="vertical-align: middle;">
                                        <p style="margin: 0; font-size: 12px; line-height: 1.5;">
                                            <a href="<?php echo esc_url( $dashboard_url ); ?>" style="color: #0097A7; text-decoration: none; font-weight: 500;"><?php esc_html_e( 'Dashboard', 'sitestaffr' ); ?></a>
                                            <span style="color: #d4cdc0; margin: 0 4px;">&#183;</span>
                                            <a href="<?php echo esc_url( $settings_url ); ?>" style="color: #0097A7; text-decoration: none; font-weight: 500;"><?php esc_html_e( 'Settings', 'sitestaffr' ); ?></a>
                                        </p>
                                    </td>
                                </tr>
                            </table>
                        </td>
                    </tr>

                </table>

                <!-- Sent by SiteStaffr branding -->
                <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="580" class="container" style="max-width: 580px;">
                    <tr>
                        <td align="center" style="padding: 20px 36px 0 36px;">
                            <p style="margin: 0; font-size: 11px; color: #a0937e; line-height: 1.5;">
                                <?php
                                echo wp_kses(
                                    sprintf(
                                        /* translators: %s: SiteStaffr link */
                                        __( 'Sent by %s — AI Voice Agent for WordPress', 'sitestaffr' ),
                                        '<a href="https://sitestaffr.com" style="color: #a0937e; text-decoration: underline;">SiteStaffr</a>'
                                    ),
                                    array( 'a' => array( 'href' => array(), 'style' => array() ) )
                                );
                                ?>
                            </p>
                        </td>
                    </tr>
                </table>

            </td>
        </tr>
    </table>
</body>
</html>
<?php // phpcs:enable WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound ?>
