<?php
/** @var string $authPageTitle */
/** @var string $authEyebrow */
/** @var string $authTitle */
/** @var string $authDescription */
/** @var string $authFormTitle */
/** @var string $authFormDescription */
/** @var string $authFormIcon */
/** @var array<int,array{icon:string,title:string,text:string}> $authBenefits */

if (!function_exists('auth_e')) {
    function auth_e(mixed $value): string
    {
        return htmlspecialchars((string) $value, ENT_QUOTES, 'UTF-8');
    }
}

$authPageTitle = $authPageTitle ?? 'Acceso';
$authEyebrow = trim((string) ($authEyebrow ?? ''));
$authTitle = trim((string) ($authTitle ?? ''));
$authDescription = trim((string) ($authDescription ?? ''));
$authFormTitle = $authFormTitle ?? 'Bienvenido';
$authFormDescription = $authFormDescription ?? 'Completa los datos para continuar.';
$authFormIcon = $authFormIcon ?? 'fas fa-shield-halved';
$authBenefits = $authBenefits ?? [];

$brandName = (string) ($ui_title_system ?? 'Ave Fénix');
$brandPrimary = (string) ($ui_color_button_hex ?? $ui_color_primary_bg_hex ?? '#dc2626');
if (!preg_match('/^#[0-9a-fA-F]{6}$/', $brandPrimary)) $brandPrimary = '#dc2626';
$brandRgb = implode(', ', [hexdec(substr($brandPrimary, 1, 2)), hexdec(substr($brandPrimary, 3, 2)), hexdec(substr($brandPrimary, 5, 2))]);
$sideImage = trim((string) ($ui_fondo_login_path ?? 'assets/img/fondo.jpg'));
$authPageSlug = preg_replace('/[^a-z0-9_-]+/i', '-', pathinfo(basename((string) ($_SERVER['PHP_SELF'] ?? 'auth')), PATHINFO_FILENAME));

$panelEyebrow = $authEyebrow !== '' ? $authEyebrow : (string) ($ui_auth_panel_eyebrow ?? 'PLATAFORMA PROFESIONAL');
$panelTitle = $authTitle !== '' ? $authTitle : (string) ($ui_auth_panel_title ?? 'Convierte la entrega de códigos en una operación rápida, ordenada y confiable.');
$panelDescription = $authDescription !== '' ? $authDescription : (string) ($ui_auth_panel_description ?? 'Centraliza cuentas, clientes, buzones, renovaciones y consultas en un sistema preparado para trabajar con tu propia marca.');
$panelBenefits = $authBenefits ?: [
    ['icon' => 'fas fa-right-to-bracket', 'title' => (string) ($ui_auth_benefit_1_title ?? 'Acceso centralizado'), 'text' => (string) ($ui_auth_benefit_1_text ?? 'Ingresa de forma segura al panel donde administras tu operación.')],
    ['icon' => 'fas fa-shield-halved', 'title' => (string) ($ui_auth_benefit_2_title ?? 'Sesión protegida'), 'text' => (string) ($ui_auth_benefit_2_text ?? 'Tus credenciales se validan antes de habilitar herramientas y datos administrativos.')],
    ['icon' => 'fas fa-key', 'title' => (string) ($ui_auth_benefit_3_title ?? 'Recuperación segura'), 'text' => (string) ($ui_auth_benefit_3_text ?? 'Recupera el acceso mediante un enlace temporal enviado al correo registrado.')],
];
$panelNote = (string) ($ui_auth_panel_note ?? 'Acceso protegido, consultas controladas y configuración centralizada para una operación profesional.');
?>
<!doctype html>
<html lang="<?= auth_e($ui_language ?? 'es') ?>">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="theme-color" content="<?= auth_e($brandPrimary) ?>">
    <title><?= auth_e($authPageTitle) ?> | <?= auth_e($brandName) ?></title>
    <?php if (!empty($ui_favicon_path)): ?><link rel="icon" href="<?= auth_e($ui_favicon_path) ?>"><?php endif; ?>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap" rel="stylesheet">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" rel="stylesheet">
    <link href="assets/css/auth-premium.css?v=9.0.0" rel="stylesheet">
    <link href="assets/css/public-shared.css?v=1.0.0" rel="stylesheet">
    <style>
:root{--auth-primary:<?= auth_e($brandPrimary) ?>;--auth-primary-rgb:<?= auth_e($brandRgb) ?>}
body.auth-page{--auth-page-image:url('<?= auth_e($sideImage) ?>')}
.auth-information{--auth-side-image:url('<?= auth_e($sideImage) ?>')}
.auth-page-background{background-image:linear-gradient(112deg,rgba(2,6,23,.24),rgba(2,6,23,.05) 50%,rgba(var(--auth-primary-rgb),.11)),url('<?= auth_e($sideImage) ?>'),url('assets/img/fondo.jpg')!important}
.auth-shell{place-items:center!important;padding:calc(var(--public-header-height) + 24px) 18px calc(var(--public-footer-height) + 24px)!important}
.auth-card{width:min(1120px,100%)!important;grid-template-columns:minmax(330px,.9fr) minmax(430px,1.1fr)!important;border-radius:24px!important;background:rgba(255,255,255,.97)!important;box-shadow:0 34px 90px rgba(2,6,23,.36)!important;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.auth-information{min-height:590px!important;padding:38px 34px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;background:linear-gradient(150deg,rgba(5,11,24,.94),rgba(15,23,42,.88) 52%,rgba(var(--auth-primary-rgb),.76)),var(--auth-side-image) center/cover no-repeat!important}
.auth-information h1{font-size:clamp(30px,3.1vw,43px)!important}.auth-information>p{font-size:14px!important;line-height:1.65!important}.auth-benefits{margin-top:24px!important}.auth-benefit{padding:13px 14px!important}.auth-side-note{margin-top:22px!important;padding-top:18px;border-top:1px solid rgba(255,255,255,.16)}
.auth-form-panel{padding:34px 38px!important;background:rgba(255,255,255,.985)!important}.auth-form-heading{margin-bottom:18px!important}
.auth-page-registro .auth-card{width:min(1240px,100%)!important;grid-template-columns:minmax(320px,.76fr) minmax(620px,1.24fr)!important}.auth-page-registro .auth-information{min-height:720px!important}.auth-page-registro .auth-form-panel{padding:28px 34px!important}
@media(max-width:900px){.auth-card,.auth-page-registro .auth-card{grid-template-columns:1fr!important;width:min(720px,100%)!important}.auth-form-panel{grid-row:1!important}.auth-information{grid-row:2!important;min-height:auto!important;padding:30px 26px!important}.auth-page-registro .auth-information{min-height:auto!important}.auth-benefits{grid-template-columns:1fr!important}}
@media(max-width:560px){.auth-shell{padding-left:10px!important;padding-right:10px!important}.auth-form-panel,.auth-page-registro .auth-form-panel{padding:22px 16px!important}.auth-information{padding:26px 18px!important}.auth-card{border-radius:18px!important}.auth-information h1{font-size:29px!important}}
    </style>
</head>
<body class="auth-page auth-page-<?= auth_e($authPageSlug) ?>">
<div class="auth-page-background" aria-hidden="true"></div>
<?php require __DIR__ . '/public_header.php'; ?>
<main class="auth-shell">
    <section class="auth-card" aria-labelledby="auth-form-title">
        <aside class="auth-information">
            <span class="auth-eyebrow"><i class="fas fa-wand-magic-sparkles"></i><?= auth_e($panelEyebrow) ?></span>
            <h1><?= auth_e($panelTitle) ?></h1>
            <p><?= auth_e($panelDescription) ?></p>
            <div class="auth-benefits">
                <?php foreach ($panelBenefits as $benefit): ?>
                    <article class="auth-benefit">
                        <span class="auth-benefit-icon"><i class="<?= auth_e($benefit['icon']) ?>"></i></span>
                        <span><strong><?= auth_e($benefit['title']) ?></strong><span><?= auth_e($benefit['text']) ?></span></span>
                    </article>
                <?php endforeach; ?>
            </div>
            <p class="auth-side-note"><i class="fas fa-shield-halved"></i><span><?= auth_e($panelNote) ?></span></p>
        </aside>
        <section class="auth-form-panel">
            <div class="auth-form-heading">
                <span class="auth-form-heading-icon"><i class="<?= auth_e($authFormIcon) ?>"></i></span>
                <div><h2 id="auth-form-title"><?= auth_e($authFormTitle) ?></h2><p><?= auth_e($authFormDescription) ?></p></div>
            </div>
