<?php
/**
 * Hulyx Footer Logic
 * Version: 1.1.1 — Optimized Rectangular Push Glow Toggle
 */

if ( ! defined( 'ABSPATH' ) ) exit;

add_action('wp_footer', function() {
    $keys = ['manual', 'tools', 'footer_tuto', 'footer_account'];
    $cfg = [];
    foreach($keys as $k) {
        $def = ($k === 'manual' ? 'Engine' : ($k === 'tools' ? 'Audio' : ($k === 'footer_tuto' ? 'Guide' : 'Login')));
        $cfg[$k] = [
            'text' => get_option("hulyx_ui_{$k}_text", $def),
            'icon' => get_option("hulyx_ui_{$k}_icon", ''),
            'size' => get_option("hulyx_ui_{$k}_size", '24'),
            'show' => get_option("hulyx_ui_{$k}_show_text", '1')
        ];
    }
    
    $render_icon = function($data, $size) {
        if (empty($data)) return '';
        $style = "width:{$size}px; height:{$size}px; display:block; object-fit:contain;";
        if (strpos($data, '<svg') !== false) return preg_replace('/<svg/i', '<svg style="'.$style.'"', $data);
        return '<img src="' . esc_url($data) . '" style="' . $style . '">';
    };
    ?>
    <style>
        #hulyx-footer-nav {
            position: fixed;
            bottom: 0;
            left: 0;
            right: 0;
background-color: black;
            height: 70px;
           
            backdrop-filter: blur(10px);
            display: flex;
            justify-content: space-around;
            align-items: center;
            z-index: 9999;
            border-top: 1px solid rgba(255, 255, 255, 0.1);
            padding: 0 10px;
        }

        .h-nav-item-wrapper {
            flex: 1;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .hulyx-nav-item {
            background: none;
            border: none;
            color: #fff;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 4px;
            cursor: pointer;
            transition: 0.3s;
            opacity: 0.7;
            padding: 0;
            width: 100%;
        }

        .hulyx-nav-item:hover, .hulyx-nav-item.active {
            opacity: 1;
        }

        .hulyx-icon-wrap {
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .hulyx-nav-label {
            font-size: 10px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.5px;
        }

        /* ── MODIFIED PUSH GLOW TOGGLE (RECTANGULAR) ────────────────── */
        .hpg-wrap {
            display: inline-block;
            user-select: none;
            position: relative;
            padding: 10px; 
            flex-shrink: 0; /* Empêche l'écrasement en largeur */
        }

        .hpg-checkbox {
            display: none;
        }

        .hpg-btn {
            display: block;
            position: relative;
            /* Augmentation de ~15% et format rectangle */
            width: 68px;
            height: 58px;
            background-color: #dfdfdf;
            border-radius: 14px; /* Plus rectangle que rond */
            cursor: pointer;
            box-shadow: 0 5px 10px 0px #333, 
                        0 0 0 3px #444, 
                        0 0 8px 2px transparent, 
                        0 0 0 6px #919191;
            transition: all 150ms ease-in;
        }

        /* Icône intérieure (Cercle) */
        .hpg-btn:before {
            content: '';
            display: block;
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            width: 26px; /* Ajusté (+15%) */
            height: 26px;
            border-radius: 50%;
            background-color: #0094e0;
            box-shadow: inset 0 0 0 5px #aaa, 
                        inset 0 0 0 14px #dfdfdf;
            transition: all 250ms ease-in;
        }

        /* Icône intérieure (Barre verticale) */
        .hpg-btn:after {
            content: '';
            display: block;
            position: absolute;
            left: 50%;
            top: 35%;
            transform: translate(-50%, -50%);
            width: 5px; /* Ajusté (+15%) */
            height: 14px;
            background-color: #aaa;
            box-shadow: 0 0 0 2.5px #dfdfdf;
            transition: all 250ms ease-in;
        }

        .hpg-btn:hover:before {
            box-shadow: inset 0 0 0 5px #777, 
                        inset 0 0 0 14px #dfdfdf;
        }

        .hpg-btn:hover:after {
            background-color: #777;
        }

        .hpg-checkbox:checked + .hpg-btn {
            box-shadow: 0 0px 8px 0 #0076b3, 
                        0 0 0 3px #0094e0, 
                        0 0 30px 0 #0094e0, 
                        0 0 0 6px #777;
        }

        .hpg-checkbox:checked + .hpg-btn:before {
            box-shadow: inset 0 0 0 5px #0094e0, 
                        inset 0 0 0 14px #dfdfdf;
        }

        .hpg-checkbox:checked + .hpg-btn:after {
            background-color: #0094e0;
        }
    </style>

    <div id="hulyx-footer-nav">
        <div class="h-nav-item-wrapper">
            <button class="hulyx-nav-item h-trigger-tutorial" id="hulyx-btn-footer-tuto">
                <div class="hulyx-icon-wrap"><?php echo $render_icon($cfg['footer_tuto']['icon'], $cfg['footer_tuto']['size']); ?></div>
                <?php if($cfg['footer_tuto']['show'] === '1'): ?><span class="hulyx-nav-label"><?php echo esc_html($cfg['footer_tuto']['text']); ?></span><?php endif; ?>
            </button>
        </div>

        <div class="h-nav-item-wrapper">
            <div class="hpg-wrap" id="hulyx-strobe-trigger">
                <input type="checkbox" id="hulyx-session-toggle" class="hpg-checkbox">
                <label class="hpg-btn" for="hulyx-session-toggle"></label>
            </div>
        </div>

        <div class="h-nav-item-wrapper">
            <button class="hulyx-nav-item h-trigger-auth" id="hulyx-btn-footer-account">
                <div class="hulyx-icon-wrap"><?php echo $render_icon($cfg['footer_account']['icon'], $cfg['footer_account']['size']); ?></div>
                <?php if($cfg['footer_account']['show'] === '1'): ?><span class="hulyx-nav-label"><?php echo esc_html($cfg['footer_account']['text']); ?></span><?php endif; ?>
            </button>
        </div>
    </div>
    <?php
}, 100);