<?php
/** @var \Autogedal\BlackFriday\Block\Landing $block */
/** @var \Magento\Framework\Escaper $escaper */
$day = $block->getConfig()->getStartDayLabel();
$period = $block->getConfig()->getPeriodLabel();
?>
<div class="bf-landing" id="bf-landing" data-bf-start="<?= $escaper->escapeHtmlAttr($block->getConfig()->getStartIso()) ?>">
    <header class="bf-header">
        <div class="bf-wrap">
            <div class="bf-brand">
                <a class="bf-logo" href="<?= $escaper->escapeUrl($block->getBaseUrl()) ?>" title="AutoGedal">
                    <img src="<?= $escaper->escapeUrl($block->getViewFileUrl('Autogedal_BlackFriday::images/bf-logo.png')) ?>" alt="AutoGedal" width="420" height="128"/>
                </a>
                <a class="bf-back" href="<?= $escaper->escapeUrl($block->getBaseUrl()) ?>">
                    <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M13 8H3M7 4L3 8l4 4"/></svg>
                    <span><?= $escaper->escapeHtml(__('Revino la site')) ?></span>
                </a>
            </div>
            <div class="bf-header-actions">
                <button class="bf-fav-pill bf-callout" type="button" data-bf-favs aria-label="<?= $escaper->escapeHtmlAttr(__('Produse favorite')) ?>">
                    <svg viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M12 20s-7-4.4-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 5.6-7 10-7 10z"/></svg>
                    <span><?= $escaper->escapeHtml(__('Favorite')) ?></span><b data-bf="fav-count">0</b>
                </button>
                <div class="bf-cart"><?= $block->getChildHtml('minicart') ?></div>
            </div>
        </div>
    </header>
    <div class="bf-neon-line" aria-hidden="true"></div>
    <div class="bf-wrap">

        <div class="bf-notice bf-callout" data-bf="notice" role="status" hidden>
            <span data-bf="notice-text"></span>
            <button type="button" class="bf-notice-close" data-bf-notice-close aria-label="<?= $escaper->escapeHtmlAttr(__('Închide')) ?>">&times;</button>
        </div>

        <section class="bf-hero">
            <h1 class="bf-title">Black <span class="bf-friday">Friday</span></h1>
            <div class="bf-cd-label" data-bf="cd-label"><?= $escaper->escapeHtml(__('Începe în')) ?></div>
            <div class="bf-cd" role="timer" aria-live="off">
                <div class="bf-cd-box bf-callout"><b data-bf="cd-d">00</b><span><?= $escaper->escapeHtml(__('Zile')) ?></span></div>
                <div class="bf-cd-box bf-callout"><b data-bf="cd-h">00</b><span><?= $escaper->escapeHtml(__('Ore')) ?></span></div>
                <div class="bf-cd-box bf-callout"><b data-bf="cd-m">00</b><span><?= $escaper->escapeHtml(__('Minute')) ?></span></div>
                <div class="bf-cd-box bf-callout"><b data-bf="cd-s">00</b><span><?= $escaper->escapeHtml(__('Secunde')) ?></span></div>
            </div>
            <div class="bf-live bf-callout"><i></i><span data-bf="live-text"><?= $escaper->escapeHtml(__('Reducerile sunt live')) ?></span></div>
            <div class="bf-facts">
                <span><?= $escaper->escapeHtml(__('Reduceri de până la')) ?> <b>40%</b></span>
                <span class="bf-date"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" aria-hidden="true"><rect x="3" y="5" width="18" height="16" rx="2.5"/><path d="M3 10h18M8 3v4M16 3v4"/></svg><?= $escaper->escapeHtml($period) ?></span>
            </div>
            <p class="bf-sub" data-bf="hero-sub"><?= $escaper->escapeHtml(__('Adaugă la favorite produsele care te interesează. Te anunțăm primul când se reduc.')) ?></p>
            <div class="bf-cta">
                <a class="bf-btn bf-ghost" href="#bf-newsletter" data-bf-go="bf-newsletter" data-bf="cta-nl"><?= $escaper->escapeHtml(__('Anunță-mă pe email')) ?></a>
            </div>
        </section>

        <section class="bf-panel" id="bf-products" aria-labelledby="bf-products-title">
            <div class="bf-panel-head">
                <h2 id="bf-products-title"><?= $escaper->escapeHtml(__('Produse incluse în Black Friday')) ?></h2>
                <p><?= $escaper->escapeHtml(__('Toate produsele de aici vor fi reduse. În limita stocului.')) ?></p>
            </div>
            <p class="bf-fav-note" data-bf="fav-note"><?= $escaper->escapeHtml(__('Abonează-te și pe %1 îți trimitem pe email prețurile de Black Friday pentru produsele tale favorite.', $day)) ?></p>
            <div class="bf-tabs" role="tablist" aria-label="<?= $escaper->escapeHtmlAttr(__('Categorii')) ?>" data-bf="tabs"></div>
            <div class="bf-filters" data-bf="filters"></div>
            <p class="bf-uni-note" data-bf="uni-note" hidden><?= $escaper->escapeHtml(__('✓ Produsele din această categorie sunt universale: se potrivesc pe orice mașină.')) ?></p>
            <div class="bf-grid" data-bf="grid"><div class="bf-loading"><?= $escaper->escapeHtml(__('Se încarcă produsele…')) ?></div></div>
            <div class="bf-more" data-bf="more"></div>
        </section>

        <section class="bf-panel" id="bf-newsletter" aria-labelledby="bf-nl-title">
            <div class="bf-nl">
                <div>
                    <h2 id="bf-nl-title" data-bf="nl-title"><?= $escaper->escapeHtml(__('Primești prețurile primul')) ?></h2>
                    <p data-bf="nl-sub"><?= $escaper->escapeHtml(__('Primești ofertele de Black Friday pe email.')) ?></p>
                </div>
                <div>
                    <form class="bf-nl-form" data-bf="nl-form" novalidate>
                        <input type="email" name="email" autocomplete="email" placeholder="<?= $escaper->escapeHtmlAttr(__('Emailul tău')) ?>" aria-label="Email" required/>
                        <button class="bf-btn" type="submit" data-bf="nl-btn"><?= $escaper->escapeHtml(__('Mă abonez')) ?></button>
                        <label class="bf-check"><input type="checkbox" name="consent" value="1"/><span><?= $escaper->escapeHtml(__('Sunt de acord să primesc newsletterul AutoGedal. Mă pot dezabona oricând.')) ?></span></label>
                        <div class="bf-err" data-bf="nl-err" role="alert"></div>
                    </form>
                    <div class="bf-done bf-callout" data-bf="nl-done" hidden>
                        <span class="bf-ok"><svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M3 8.5l3 3 7-7"/></svg></span>
                        <div>
                            <b><?= $escaper->escapeHtml(__('Te-ai abonat')) ?></b><span data-bf="nl-done-text"></span>
                            <button type="button" class="bf-link" data-bf-nl-change><?= $escaper->escapeHtml(__('Folosește alt email')) ?></button>
                        </div>
                    </div>
                </div>
            </div>
        </section>

        <p class="bf-legal"><?= $escaper->escapeHtml(__('Oferta este valabilă în limita stocului disponibil, în perioada %1.',mb_strtolower($period))) ?></p>
    </div>
    <div class="bf-backdrop" data-bf="backdrop" hidden></div>
    <div class="bf-toast" data-bf="toast" role="status"></div>
</div>
<script type="text/x-magento-init">
    {"#bf-landing": {"Autogedal_BlackFriday/js/landing": <?= /* @noEscape */ $block->getJsConfig() ?>}}
</script>
