<?php
// Kombinierte Strom- und EVCC-Anzeige mit AJAX-Update
// ===================================================

// Zeitzone
date_default_timezone_set('Europe/Berlin');

// Prüfen ob AJAX-Abfrage
$isAjax = isset($_GET['ajax']) && $_GET['ajax'] == '1';

// === Abschnitt 1: Netzanschluss (Shelly 3EM) ===
$shelly_ip_3em = "192.168.0.231";
$endpoint_3em = "http://$shelly_ip_3em/rpc/Shelly.GetStatus";
$maxPower_3em = 500;
$minPower_3em = 50;

// === Abschnitt 2: PV-Anlage (Shelly EM1 / Pro EM50) ===
$shelly_ip_pv = "192.168.0.31";
$endpoint_pv = "http://$shelly_ip_pv/rpc/Shelly.GetStatus";
$pv_kWp = 5.035; // PV-Leistung in kWp für die erste Anlage

// === Abschnitt 3: Zusätzlicher Shelly 3EM-63T (GEN3) für 2. PV-Anlage ===
$shelly_ip_3em_63t = "192.168.0.32"; // IP-Adresse für den 3EM-63T
$endpoint_3em_63t = "http://$shelly_ip_3em_63t/rpc/Shelly.GetStatus";
$pv_kWp_63t = 1.02; // PV-Leistung in kWp für die zweite Anlage (6 x 170 Wp)

// === Abschnitt 4: EVCC ===
$evcc_url = "http://192.168.0.37:7070/api/state";

// Reserve für Akku in Prozent
$battery_reserve_percent = 10;

// Funktion zum Abrufen der Shelly-Daten
function fetchShellyData($url) {
    $ch = curl_init();
    curl_setopt_array($ch, [
        CURLOPT_URL => $url,
        CURLOPT_RETURNTRANSFER => true,
        CURLOPT_TIMEOUT => 3,
        CURLOPT_CONNECTTIMEOUT => 2
    ]);
    $response = curl_exec($ch);
    $http_code = curl_getinfo($ch, CURLINFO_HTTP_CODE);
    curl_close($ch);
    
    if ($http_code === 200 && $response) {
        return json_decode($response, true);
    }
    return null;
}

// Funktion zur Berechnung der Hintergrundfarbe
function calculateBackgroundColor() {
    $lat = 50.8009;
    $lon = 11.5875;
    $dayColor = [224, 224, 224];
    $nightColor = [96, 96, 96];
    $twilightDuration = 2;

    $now = time();
    $sunrise = date_sunrise($now, SUNFUNCS_RET_TIMESTAMP, $lat, $lon);
    $sunset = date_sunset($now, SUNFUNCS_RET_TIMESTAMP, $lat, $lon);

    $current_hour = (float)date('G') + ((float)date('i') / 60);
    $sunrise_hour = (float)date('G', $sunrise) + ((float)date('i', $sunrise) / 60);
    $sunset_hour = (float)date('G', $sunset) + ((float)date('i', $sunset) / 60);

    $t = 0;

    if ($current_hour >= $sunset_hour && $current_hour <= $sunset_hour + $twilightDuration) {
        $t = ($current_hour - $sunset_hour) / $twilightDuration;
    } else if ($current_hour >= $sunrise_hour - $twilightDuration && $current_hour < $sunrise_hour) {
        $t = 1 - (($current_hour - ($sunrise_hour - $twilightDuration)) / $twilightDuration);
    } else if ($current_hour < $sunrise_hour - $twilightDuration || $current_hour > $sunset_hour + $twilightDuration) {
        $t = 1;
    }

    $r = round($dayColor[0] + ($nightColor[0] - $dayColor[0]) * $t);
    $g = round($dayColor[1] + ($nightColor[1] - $dayColor[1]) * $t);
    $b = round($dayColor[2] + ($nightColor[2] - $dayColor[2]) * $t);
    return "rgb($r,$g,$b)";
}

// Funktion zur Berechnung der Akku-Laufzeit
function calculateBatteryRuntime($usable_energy, $power_display, $battery_reserve_percent) {
    // Wenn der Akku geladen wird (positive Leistung) oder keine nutzbare Energie vorhanden ist
    if ($power_display >= 0 || $usable_energy <= 0) {
        return '-';
    }
    
    // Umrechnung von W in kW und Berechnung der Laufzeit in Stunden
    $power_kw = abs($power_display) / 1000;
    if ($power_kw <= 0) {
        return '-';
    }
    
    $runtime_hours = $usable_energy / $power_kw;
    
    // Aktuelle Zeit
    $current_time = time();
    $end_time = $current_time + ($runtime_hours * 3600);
    
    // Deutsche Wochentage
    $german_weekdays = [
        'Sun' => 'So',
        'Mon' => 'Mo',
        'Tue' => 'Di',
        'Wed' => 'Mi',
        'Thu' => 'Do',
        'Fri' => 'Fr',
        'Sat' => 'Sa'
    ];
    
    $weekday_english = date('D', $end_time);
    $weekday_german = $german_weekdays[$weekday_english] ?? $weekday_english;
    
    // Formatierte Ausgabe: HH:mm Uhr\nWochentag TT.MM.JJJJ
    $time_formatted = date('H:i', $end_time) . " Uhr";
    $date_formatted = $weekday_german . ". " . date('d.m.y', $end_time);
    
    return $time_formatted . "<br>" . $date_formatted;
}

// Funktion zur Bestimmung des Akku-Status-Textes
function getBatteryStatusText($power_display, $usable_soc) {
    // Akku wird geladen (positive Leistung)
    if ($power_display > 0) {
        return ['label' => 'Akku:', 'value' => 'wird geladen'];
    }
    // Akku ist im Leerlauf (Leistung = 0) und hat noch 1-2% Restkapazität
    elseif ($power_display == 0 && $usable_soc > 0 && $usable_soc <= 2) {
        return ['label' => 'Akku:', 'value' => 'warten auf Ladung'];
    }
    // Akku ist leer
    elseif ($usable_soc <= 0) {
        return ['label' => 'Akku ist leer:', 'value' => 'Netzbezug'];
    }
    // Akku wird entladen (negative Leistung) und hat noch Kapazität
    else {
        return ['label' => 'Akku reicht bei aktuellem<br>Verbrauch bis circa:', 'value' => ''];
    }
}

// Funktion zur Bestimmung des Akku-Icons basierend auf SoC
function getBatteryIcon($soc) {
    if ($soc <= 15) {
        return '&#xf244;'; // leer
    } elseif ($soc <= 25) {
        return '&#xf243;'; // fast leer
    } elseif ($soc <= 50) {
        return '&#xf242;'; // halb voll
    } elseif ($soc <= 75) {
        return '&#xf241;'; // fast voll
    } else {
        return '&#xf240;'; // voll
    }
}

// Dauer formatieren
function format_duration($seconds) {
    if (!$seconds || $seconds <= 0) return "–";
    $h = floor($seconds / 3600);
    $m = floor(($seconds % 3600) / 60);
    $s = $seconds % 60;
    return sprintf("%02d:%02d:%02d", $h, $m, $s);
}

// Modus übersetzen
function translate_mode($mode) {
    $map = [
        'off'    => 'Aus',
        'pv'     => 'PV',
        'minpv'  => 'Min+PV',
        'now'    => 'Schnell'
    ];
    return $map[strtolower($mode)] ?? ucfirst($mode);
}

// Shelly-Daten abrufen
$data_3em = fetchShellyData($endpoint_3em);
$data_pv = fetchShellyData($endpoint_pv);
$data_3em_63t = fetchShellyData($endpoint_3em_63t);

// EVCC-Daten abrufen
$evcc_data = @file_get_contents($evcc_url);
$data_evcc = $evcc_data ? json_decode($evcc_data, true) : null;

$loadpoint = $data_evcc['loadpoints'][0] ?? [];
$battery = $data_evcc['battery'][0] ?? null;

// Daten verarbeiten für Netzanschluss
if ($data_3em && isset($data_3em["em:0"])) {
    $em1 = $data_3em["em:0"];
    $act_power_3em = (float)$em1["total_act_power"];
    $voltage_avg_3em = ($em1["a_voltage"] + $em1["b_voltage"] + $em1["c_voltage"]) / 3;
    $freq_3em = (float)$em1["a_freq"];
    $pf_avg_3em = ($em1["a_pf"] + $em1["b_pf"] + $em1["c_pf"]) / 3;
    $eff_current_3em = $voltage_avg_3em > 0 ? abs($act_power_3em / $voltage_avg_3em) : 0;

    $act_power_f_3em = number_format($act_power_3em, 1, ',', '.');
    $voltage_f_3em = number_format($voltage_avg_3em, 1, ',', '');
    $freq_f_3em = number_format($freq_3em, 2, ',', '');
    $pf_f_3em = number_format($pf_avg_3em, 2, ',', '');
    $eff_current_f_3em = number_format($eff_current_3em, 2, ',', '');
} else {
    $act_power_3em = 0;
    $act_power_f_3em = "Fehler";
    $voltage_f_3em = "Fehler";
    $freq_f_3em = "Fehler";
    $pf_f_3em = "Fehler";
    $eff_current_f_3em = "Fehler";
}

// Daten verarbeiten für PV
if ($data_pv) {
    $act_power_pv = abs($data_pv['em1:0']['act_power'] ?? 0);
    $current_pv = number_format(($data_pv['em1:0']['current'] ?? 0), 2, ',', '');
    $voltage_pv = number_format(($data_pv['em1:0']['voltage'] ?? 0), 1, ',', '');
    $freq_pv = number_format(($data_pv['em1:0']['freq'] ?? 0), 2, ',', '');
    $pf_pv = number_format(($data_pv['em1:0']['pf'] ?? 0), 2, ',', '');

    $power_per_kWp = $pv_kWp > 0 ? $act_power_pv / $pv_kWp : 0;
    $power_per_kWp_f = number_format($power_per_kWp, 1, ',', '.');
    $act_power_formatted_pv = number_format($act_power_pv, 1, ',', '.');
} else {
    $act_power_pv = 0;
    $act_power_formatted_pv = "Fehler";
    $current_pv = "Fehler";
    $voltage_pv = "Fehler";
    $freq_pv = "Fehler";
    $pf_pv = "Fehler";
    $power_per_kWp_f = "Fehler";
}

// Daten verarbeiten für zusätzlichen Shelly 3EM-63T (GEN3)
if ($data_3em_63t) {
    // GEN3-Geräte haben eine andere Struktur - wir prüfen verschiedene mögliche Pfade
    if (isset($data_3em_63t["em1:0"])) {
        // Das ist wahrscheinlich die korrekte Struktur für GEN3
        $em1_63t = $data_3em_63t["em1:0"];
        $act_power_3em_63t = abs($em1_63t["act_power"] ?? 0); // ACTIVE Leistung (abs für positive Werte)
        
        // Für GEN3 sind die Einzelphasen-Daten unter "a_current", "b_current", "c_current" usw.
        $current_a = $em1_63t["a_current"] ?? 0;
        $current_b = $em1_63t["b_current"] ?? 0;
        $current_c = $em1_63t["c_current"] ?? 0;
        $current_avg_3em_63t = ($current_a + $current_b + $current_c) / 3;
        
        $voltage_a = $em1_63t["a_voltage"] ?? 0;
        $voltage_b = $em1_63t["b_voltage"] ?? 0;
        $voltage_c = $em1_63t["c_voltage"] ?? 0;
        $voltage_avg_3em_63t = ($voltage_a + $voltage_b + $voltage_c) / 3;
        
        $freq_3em_63t = $em1_63t["a_freq"] ?? $em1_63t["freq"] ?? 0;
        
        $pf_a = $em1_63t["a_pf"] ?? 0;
        $pf_b = $em1_63t["b_pf"] ?? 0;
        $pf_c = $em1_63t["c_pf"] ?? 0;
        $pf_avg_3em_63t = ($pf_a + $pf_b + $pf_c) / 3;
        
    } elseif (isset($data_3em_63t["em:0"])) {
        // Alternative Struktur (wie beim alten 3EM)
        $em1_63t = $data_3em_63t["em:0"];
        $act_power_3em_63t = abs($em1_63t["total_act_power"] ?? 0);
        $current_avg_3em_63t = ($em1_63t["a_current"] + $em1_63t["b_current"] + $em1_63t["c_current"]) / 3;
        $voltage_avg_3em_63t = ($em1_63t["a_voltage"] + $em1_63t["b_voltage"] + $em1_63t["c_voltage"]) / 3;
        $freq_3em_63t = $em1_63t["a_freq"] ?? 0;
        $pf_avg_3em_63t = ($em1_63t["a_pf"] + $em1_63t["b_pf"] + $em1_63t["c_pf"]) / 3;
    } else {
        // Fallback: Ersten verfügbaren EM-Kanal suchen
        foreach ($data_3em_63t as $key => $value) {
            if (strpos($key, 'em') === 0 && is_array($value)) {
                $em1_63t = $value;
                $act_power_3em_63t = abs($em1_63t["act_power"] ?? $em1_63t["total_act_power"] ?? 0);
                $current_avg_3em_63t = ($em1_63t["a_current"] ?? $em1_63t["current"] ?? 0);
                $voltage_avg_3em_63t = ($em1_63t["a_voltage"] ?? $em1_63t["voltage"] ?? 0);
                $freq_3em_63t = $em1_63t["a_freq"] ?? $em1_63t["freq"] ?? 0;
                $pf_avg_3em_63t = $em1_63t["a_pf"] ?? $em1_63t["pf"] ?? 0;
                break;
            }
        }
    }
    
    // Formatieren der Werte
    $act_power_f_3em_63t = number_format($act_power_3em_63t, 1, ',', '.');
    $current_f_3em_63t = number_format($current_avg_3em_63t, 2, ',', '');
    $voltage_f_3em_63t = number_format($voltage_avg_3em_63t, 1, ',', '');
    $freq_f_3em_63t = number_format($freq_3em_63t, 2, ',', '');
    $pf_f_3em_63t = number_format($pf_avg_3em_63t, 2, ',', '');
    
    // PV-Leistung pro kWp für die zweite Anlage berechnen
    $power_per_kWp_63t = $pv_kWp_63t > 0 ? $act_power_3em_63t / $pv_kWp_63t : 0;
    $power_per_kWp_f_63t = number_format($power_per_kWp_63t, 1, ',', '.');
    
} else {
    $act_power_3em_63t = 0;
    $act_power_f_3em_63t = "Fehler";
    $current_f_3em_63t = "Fehler";
    $voltage_f_3em_63t = "Fehler";
    $freq_f_3em_63t = "Fehler";
    $pf_f_3em_63t = "Fehler";
    $power_per_kWp_f_63t = "Fehler";
}

// EVCC-Daten verarbeiten
if ($data_evcc) {
    // Tarifpreis
    $tarif_price = $data_evcc['tariffGrid'] ?? null;
    $tarif_display = ($tarif_price !== null)
        ? "<span class='nowrap'>Ladekosten-Summe (gerundet):</span> <span class='nowrap'>Preis aktuell: <span class='value'>" . number_format(round($tarif_price + 0.005, 2), 2, ',', '.') . " €/kWh</span>.</span>"
        : "Tarif nicht verfügbar";

    // Batteriestand
    $soc = $battery['soc'] ?? 0;
    $battery_fill = max(0, min(100, $soc));
    
    // Wallbox-Daten
    $connected = !empty($loadpoint['connected']);
    $charging = !empty($loadpoint['charging']);
    $power_evcc = $loadpoint['chargePower'] ?? 0;
    $chargedEnergy = $loadpoint['chargedEnergy'] ?? 0;
    $modeRaw = htmlspecialchars($loadpoint['mode'] ?? 'Unbekannt');
    $mode = translate_mode($modeRaw);
    $vehicle = htmlspecialchars($loadpoint['vehicleTitle'] ?? ($loadpoint['vehicleName'] ?? ''));
    $duration = format_duration($loadpoint['chargeDuration'] ?? 0);
    
    // Ladekosten berechnen
    $charged_kwh = $chargedEnergy / 1000.0;
    $tarif_display_value = ($tarif_price !== null) ? round($tarif_price + 0.005, 2) : 0;
    $preis_anzeige = round($charged_kwh * $tarif_display_value, 2);
    
    // Status-Logik
    if ($charging) {
        $statusText = "<span class='emoji' style='position:relative;top:-1px;line-height:1.2em;font-family:sans-serif'>⚡</span> lädt";
        $statusColor = "orange";
    } elseif ($connected) {
        $statusText = "<span class='emoji' style='position:relative;top:-1px;filter:grayscale(30%);-webkit-font-smoothing:none;-moz-osx-font-smoothing:grayscale;'>🚗</span> verbunden";
        $statusColor = "#222";
    } else {
        $statusText = "<span class='emoji'>✅</span> frei";
        $statusColor = "green";
    }
    
    // Batterie-Daten
    $capacity = $battery['capacity'] ?? 0;
    $power_raw = $battery['power'] ?? 0;
    $power_display = -1 * $power_raw;
    $factor = $capacity / 100;
    $energy_total = $soc * $factor;
    $usable_soc = max(0, $soc - $battery_reserve_percent);
    $usable_energy = $usable_soc * $factor;
    $power_sign = $power_display >= 0 ? "+" : "-";
    
    $soc_display = (round($soc, 1) == round($soc)) ? number_format($soc, 0, ',', '.') : number_format($soc, 1, ',', '.');
    $usable_soc_display = (round($usable_soc, 1) == round($usable_soc)) ? number_format($usable_soc, 0, ',', '.') : number_format($usable_soc, 1, ',', '.');
    
    // Akku-Laufzeit berechnen
    $battery_runtime = calculateBatteryRuntime($usable_energy, $power_display, $battery_reserve_percent);
    
    // Akku-Status-Text bestimmen
    $battery_status = getBatteryStatusText($power_display, $usable_soc);
    
    // Akku-Icon bestimmen
    $battery_icon = getBatteryIcon($soc);
    
} else {
    $statusText = "<span class='emoji'>⚠️</span> EVCC nicht erreichbar";
    $statusColor = "red";
    $power_evcc = 0;
    $soc = 0;
    $battery_fill = 0;
    $battery_runtime = '-';
    $battery_status = ['label' => 'Akku:', 'value' => 'Daten nicht verfügbar'];
    $battery_icon = '&#xf244'; // leer bei Fehler
    $mode = 'Unbekannt';
    $duration = '–';
}

// Hintergrundfarbe berechnen
$backgroundColor = calculateBackgroundColor();

$timestamp = date("d.m.Y H:i:s");

// Variablen für Titel aktualisieren
$title_power_3em = ($act_power_3em >= 0 ? '+' : '') . $act_power_f_3em;
$title_power_pv = ($act_power_pv > 0 ? '+' : '') . $act_power_formatted_pv;

// Wenn AJAX-Abfrage, nur die Inhalte zurückgeben
if ($isAjax) {
    ob_clean();
    ?>
    
<!-- Netzanschluss Content -->
<div id="netzanschluss-content">
  <div class="row"><span class="label">Wirkleistung (W) <span class="desktop-only"><br></span>Bezug&nbsp;+<span class="desktop-only"> bzw. </span><span class="mobil-only">/</span>Einspeisung&nbsp;-&nbsp;:&nbsp;</span><span class="value mono"><span id="act-power-3em" style="text-shadow:0.5px 0.5px 0px rgba(32,48,64,0.5);border-bottom:1.5px solid #444;"><?= htmlspecialchars($title_power_3em) ?>&nbsp;W</span>&nbsp;</span></div>
  <div class="row"><span class="label">Stromstärke (A) <span class="mobil-only"><br></span>aus Wirkleistung berechnet:&nbsp;</span><span class="value mono"><?= htmlspecialchars($eff_current_f_3em) ?>&nbsp;A&nbsp;</span></div>
  <div class="row"><span class="label">Spannung (V) <span class="mobil-only"><br></span>Durchschnitt der 3‑Phasen:&nbsp;</span><span class="value mono"><?= htmlspecialchars($voltage_f_3em) ?>&nbsp;V&nbsp;</span></div>
  <div class="row"><span class="label">Frequenz (Hz) Netzfrequenz:&nbsp;</span><span class="value mono"><?= htmlspecialchars($freq_f_3em) ?>&nbsp;Hz</span></div>
  <div class="row"><span class="label">Leistungsfaktor (pf) <br>Durchschnitt der 3‑Phasen:&nbsp;</span><span class="value mono"><?= htmlspecialchars($pf_f_3em) ?>&nbsp;pf</span></div>
</div>

<!-- PV-Anlage Content -->
<div id="pv-content">
  <div class="row"><span class="label">Wirkleistung (W) <br>Nutzbar<span class="desktop-only">e Leistung</span> im Hausnetz: &nbsp;</span><span class="value mono"><span id="act-power-pv" style="text-shadow:0.5px 0.5px 0px rgba(32,48,64,0.5);border-bottom:1.5px solid #444"><?= htmlspecialchars($title_power_pv) ?>&nbsp;W</span>&nbsp;</span></div>
  <div class="row"><span class="label">Stromstärke (A) <span class="mobil-only"><br></span>Fließender Strom: &nbsp;</span><span class="value mono"><?= htmlspecialchars($current_pv) ?>&nbsp;A&nbsp;</span></div>
  <div class="row"><span class="label">Spannung (V) Netzspannung: &nbsp;</span><span class="value mono"><?= htmlspecialchars($voltage_pv) ?>&nbsp;V&nbsp;</span></div>
  <div class="row"><span class="label">Frequenz (Hz) Netzfrequenz: &nbsp;</span><span class="value mono"><?= htmlspecialchars($freq_pv) ?>&nbsp;Hz</span></div>
  <div class="row"><span class="label">Leistungsfaktor (pf) <br>Verhältnis Wirk‑ zu Scheinleistung: &nbsp;</span><span class="value mono"><?= htmlspecialchars($pf_pv) ?>&nbsp;pf</span></div>
  <div class="row"><span class="label">PV‑Leistung <span class="mobil-only"><br></span>pro kWp (W/kWp): &nbsp;</span><span class="value mono prokWp"><?= htmlspecialchars($power_per_kWp_f) ?>&nbsp;W/kWp</span></div>
</div>

<!-- Shelly 3EM-63T Content -->
<div id="shelly-3em-63t-content">
  <div class="row"><span class="label">Wirkleistung (W) <br>Nutzbare Leistung im Hausnetz: &nbsp;</span><span class="value mono"><span id="act-power-3em-63t" style="text-shadow:0.5px 0.5px 0px rgba(32,48,64,0.5);border-bottom:1.5px solid #444"><?= htmlspecialchars(($act_power_3em_63t > 0 ? '+' : '') . $act_power_f_3em_63t) ?>&nbsp;W</span>&nbsp;</span></div>
  <div class="row"><span class="label">Stromstärke (A) <span class="mobil-only"><br></span>Durchschnitt der 3‑Phasen: &nbsp;</span><span class="value mono"><?= htmlspecialchars($current_f_3em_63t) ?>&nbsp;A&nbsp;</span></div>
  <div class="row"><span class="label">Spannung (V) <span class="mobil-only"><br></span>Durchschnitt der 3‑Phasen:&nbsp;</span><span class="value mono"><?= htmlspecialchars($voltage_f_3em_63t) ?>&nbsp;V&nbsp;</span></div>
  <div class="row"><span class="label">Frequenz (Hz) Netzfrequenz: &nbsp;</span><span class="value mono"><?= htmlspecialchars($freq_f_3em_63t) ?>&nbsp;Hz</span></div>
  <div class="row"><span class="label">Leistungsfaktor (pf) <br>Durchschnitt der 3‑Phasen: &nbsp;</span><span class="value mono"><?= htmlspecialchars($pf_f_3em_63t) ?>&nbsp;pf</span></div>
  <div class="row"><span class="label">PV‑Leistung <span class="mobil-only"><br></span>pro kWp (W/kWp): &nbsp;</span><span class="value mono prokWp"><?= htmlspecialchars($power_per_kWp_f_63t) ?>&nbsp;W/kWp</span></div>
</div>

<!-- Wallbox Content -->
<div id="wallbox-content">
<?php if ($data_evcc && !empty($loadpoint)): ?>
    <?php if ($statusText == "<span class='emoji'>✅</span> frei"): ?>
        <div class='info-center'><i style='font-size:0.95em'>Wallbox-Nutzung auf Anfrage möglich.<br>Die Daten der letzten Ladung werden unten weiterhin angezeigt.</i></div>
    <?php endif; ?>
    
    <div class='row'><span class='label'>Status:</span><span class='value mono' style='color:<?= $statusColor ?>;font-weight:400;'><?= $statusText ?></span></div>
    
    <?php if ($statusText == "<span class='emoji'>✅</span> frei"): ?>
        <div class='row'><span class='label'>Fahrzeug:</span><span class='value mono'>–</span></div>
        <div class='row'><span class='label'>Modus:</span><span class='value mono'><?= $mode ?></span></div>
		<div class='row'><span class='label'>Ladeleistung aktuell:</span><span class='value mono'><?= number_format((float)$power_evcc / 1000, 3, ',', '.') ?>&nbsp;kWh</span></div>
        <div class='row'><span class='label'>Geladen:</span><span class='value mono'><?= number_format($chargedEnergy / 1000, 3, ',', '.') ?>&nbsp;kWh</span></div>
        <div class='row'><span class='label'><?= $tarif_display ?><br>PV-Erträge sind unberücksichtigt.</span><span class='value mono'><span style='text-shadow:0.5px 0.5px 0px rgba(32,48,64,0.5);border-bottom:1.5px solid #444'><?= number_format($preis_anzeige, 2, ',', '.') ?>&nbsp;€</span>&nbsp;&nbsp;</span></div>
        <div class='row'><span class='label'>Ladedauer:</span><span class='value mono'><?= $duration ?></span></div>
    <?php else: ?>
        <div class='row'><span class='label'>Fahrzeug:</span><span class='value mono'><?= $vehicle ? $vehicle : "<em>Kein Fahrzeug erkannt</em>" ?></span></div>
        <div class='row'><span class='label'>Modus:</span><span class='value mono'><?= $mode ?></span></div>
		<div class='row'><span class='label'>Ladeleistung aktuell:</span><span class='value mono'><?= number_format((float)$power_evcc / 1000, 3, ',', '.') ?>&nbsp;kWh</span></div>
        <div class='row'><span class='label'>Geladen:</span><span class='value mono'><?= number_format($chargedEnergy / 1000, 3, ',', '.') ?>&nbsp;kWh</span></div>
        <div class='row'><span class='label'><?= $tarif_display ?><br>PV-Erträge sind unberücksichtigt.</span><span class='value mono'><span style='text-shadow:0.5px 0.5px 0px rgba(32,48,64,0.5);border-bottom:1.5px solid #444'><?= number_format($preis_anzeige, 2, ',', '.') ?>&nbsp;€</span>&nbsp;&nbsp;</span></div>
        <div class='row'><span class='label'>Ladedauer:</span><span class='value mono'><?= $duration ?></span></div>
    <?php endif; ?>
<?php else: ?>
    <div class='row'><span class='label'><span class='emoji'>⚠️</span> Keine Ladepunkte gefunden.</span></div>
<?php endif; ?>
</div>

<!-- Battery Content -->
<div id="battery-content">
<?php if ($data_evcc && $battery): ?>
    <div class='row'><span class='label'>Speicherkapazität (nutzbar):</span><span class='value mono'><?= number_format($capacity, 3, ',', '.') ?> kWh</span></div>
    <div class='row'><span class='label'>Akkustand (SoC):</span><span class='value mono'><span style='border-bottom:1.5px solid #444;'><?= $soc_display ?>&nbsp;%</span>&nbsp;&nbsp;</span></div>
    <div class='row'><span class='label'>Aktuell verfügbar:</span><span class='value mono'><?= number_format($energy_total, 3, ',', '.') ?> kWh</span></div>
    <div class='row'><span class='label'>Lade- (+) Entladeleistung (-):</span><span class='value mono'><?= $power_sign ?><?= number_format(abs($power_display), 0, ',', '.') ?>&nbsp;W&nbsp;&nbsp;</span></div>
    <div class='row'><span class='label'>Nutzbar<br>abzgl.&nbsp;<?= $battery_reserve_percent ?>&nbsp;%&nbsp;Reserve:</span><span class='value mono' style='text-shadow:0.5px 0.5px 0px rgba(32,48,64,0.5);border-bottom:1.5px solid #444;color:#333'><?= $usable_soc_display ?>&nbsp;%&nbsp;&nbsp;<br><?= number_format($usable_energy, 3, ',', '.') ?>&nbsp;kWh</span></div>
    <div class='row'><span class='label'><?= $battery_status['label'] ?></span><span class='value mono'><?= $battery_status['value'] ? $battery_status['value'] : $battery_runtime ?></span></div>
<?php else: ?>
    <div class='row'><span class='label'>Keine Batteriedaten verfügbar.</span></div>
<?php endif; ?>
</div>

<!-- Timestamp -->
<span id="timestamp"><?= htmlspecialchars($timestamp) ?></span>

<!-- Titelwerte für JavaScript -->
<span id="title-power-3em" style="display:none"><?= htmlspecialchars($title_power_3em) ?></span>
<span id="title-power-pv" style="display:none"><?= htmlspecialchars(number_format($act_power_pv + $act_power_3em_63t, 1, ',', '.')) ?> W</span>

<!-- Battery Fill Level -->
<span id="battery-fill" style="display:none"><?= $battery_fill ?></span>

<!-- Battery Icon -->
<span id="battery-icon" style="display:none"><?= $battery_icon ?></span>

<!-- Hintergrundfarbe für JavaScript -->
<span id="background-color" style="display:none"><?= $backgroundColor ?></span>

    <?php
    exit;
}

// Komplette HTML-Seite
?>
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?= htmlspecialchars($title_power_3em) ?> W / <?= htmlspecialchars(number_format($act_power_pv + $act_power_3em_63t, 1, ',', '.')) ?> W Netz- & PV-Leistung</title>
<link rel="icon" href="https://ctaas.de/box/Hochspannung.ico" type="image/x-icon">
<style>
@font-face { font-family:'Cousine';src: local('Cousine'), url('https://ctaas.de/fonts/Cousine-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap; }
@font-face { font-family: 'fa-solid';src: url('https://ctaas.de/fonts/fa-solid-900.woff2') format('woff2');font-weight:900;font-style:normal;font-display:swap; }
:root {--battery-fill: #d8f5c0;}
body {margin:0;padding:15px 7px 7px 7px;text-align:center;background-color: <?= $backgroundColor ?>;transition:background 0.7s;font-family:sans-serif;}
.grid-wrapper {display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:14px;max-width:1380px;margin:0 auto;}
.sectionbox {background:#fdfdfd;box-shadow:0 0 7px rgba(0,0,0,0.2);border:1.5px solid #777;border-radius:13px;display:flex;flex-direction:column;width:444px;transition:background 0.7s;padding:10px 5px;position:relative;overflow:hidden;}
.row {display:flex;justify-content:space-between;align-items:flex-end;padding:.35em 1em;}
.label {color:#222;font-size:1em;text-align:left;font-family:sans-serif;}
.value {font-size:1em;text-align:right;color:#222;letter-spacing:-0.015em;}
.mono {font-family:Cousine,'Office Code Pro','IBM Plex Mono','Source Code Pro','Fira Mono','Liberation Mono','Roboto Mono','DejaVu Sans Mono',Menlo,Hack,'PT Mono','Andale Mono','Droid Sans Mono','Courier Prime Code','Overpass Mono','Anonymous Pro','Ubuntu Mono',monospace;}
.prokWp {border-bottom:1.25px solid #777}
.header {font-size:1.1em;color:#555;padding:7px 0px;font-weight:900}
.footer {margin-top:12px;color:#333;font-size:0.9em;text-align:center;}
.info-center {font-weight:normal;font-size:1em;color:#222;font-family:Cousine,monospace;text-align:center;margin:2px 0 8px 0;}
.emoji {text-shadow:0 -0.75px 0 #666,1px 0 0 #666,0 0.75px 0 #666,-1.1px 0 0 #666;font-size:1.1em;opacity:0.7;display:inline-block;transform:scale(1.05,0.95);}
.nowrap {white-space:nowrap}
.mobil-only{display:none}
.desktop-only{display:inline}

/* Batterie-Füllstand */
#box-battery::before {content:"";position:absolute;left:0;right:0;bottom:0;height:var(--battery-fill-height, <?= $battery_fill ?>%);background:var(--battery-fill);opacity:0.7;z-index:0;transition:height 0.6s ease;}
#box-battery * {position:relative;z-index:2;}

/* Mobile Ansicht */
@media only screen and (max-width:480px){
.mobil-only{display:inline}
.desktop-only{display:none}
body {padding:7px 11px 7px 7px;line-height:0.95em}
.grid-wrapper {flex-direction:column;gap:7px;}
.sectionbox {width:100%;font-size:0.95em;padding:4px 0px;}
}

/* Desktop Layout für 5 Boxen */
@media only screen and (min-width: 920px) {
  .grid-wrapper {display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:auto auto;gap:14px;justify-items:center;}
  /* Erste Zeile: 3 Boxen */
  .grid-wrapper > div:nth-child(-n+3) {grid-row:1;}
  /* Zweite Zeile: 2 Boxen */
  .grid-wrapper > div:nth-child(n+4):nth-child(-n+5) {grid-row:2;}
  /* Zentriere die letzten beiden Boxen in der zweiten Zeile */
  .grid-wrapper > div:nth-child(4) {grid-column:2;}
  .grid-wrapper > div:nth-child(5) {grid-column:3;}
}
</style>
</head>
<body style="background-color: <?= $backgroundColor ?>; transition: background 0.7s;">
<div class="grid-wrapper">
<!-- Netzanschluss -->
<div class="sectionbox" id="box-3em">
  <div class="header"><span style="font-family: 'fa-solid'; font-weight: 900;">&#xf0e7;</span> Netzanschluss:<br><div style="font-weight:400;font-size:10px;margin:0px;padding:0px">(Pro 3EM 120A)</div></div>
  <div id="netzanschluss-content">
  <div class="row"><span class="label">Wirkleistung (W) <span class="desktop-only"><br></span>Bezug&nbsp;+<span class="desktop-only"> bzw. </span><span class="mobil-only">/</span>Einspeisung&nbsp;-&nbsp;:&nbsp;</span><span class="value mono"><span id="act-power-3em" style="text-shadow:0.5px 0.5px 0px rgba(32,48,64,0.5);border-bottom:1.5px solid #444;"><?= htmlspecialchars($title_power_3em) ?>&nbsp;W</span>&nbsp;</span></div>
  <div class="row"><span class="label">Stromstärke (A) <span class="mobil-only"><br></span>aus Wirkleistung berechnet:&nbsp;</span><span class="value mono"><?= htmlspecialchars($eff_current_f_3em) ?>&nbsp;A&nbsp;</span></div>
  <div class="row"><span class="label">Spannung (V) <span class="mobil-only"><br></span>Durchschnitt der 3‑Phasen:&nbsp;</span><span class="value mono"><?= htmlspecialchars($voltage_f_3em) ?>&nbsp;V&nbsp;</span></div>
  <div class="row"><span class="label">Frequenz (Hz) Netzfrequenz:&nbsp;</span><span class="value mono"><?= htmlspecialchars($freq_f_3em) ?>&nbsp;Hz</span></div>
  <div class="row"><span class="label">Leistungsfaktor (pf) <br>Durchschnitt der 3‑Phasen:&nbsp;</span><span class="value mono"><?= htmlspecialchars($pf_f_3em) ?>&nbsp;pf</span></div>
  </div>
</div>

<!-- PV-Anlage -->
<div class="sectionbox" id="box-pv">
  <div class="header"><span style="font-family: 'fa-solid'; font-weight: 900;">&#xf5ba;</span> PV:<br><div style="font-weight:400;font-size:10px;margin:0px;padding:0px">Dach (Pro EM-50)</div></div>
  <div id="pv-content">
  <div class="row"><span class="label">Wirkleistung (W) <br>Nutzbar<span class="desktop-only">e Leistung</span> im Hausnetz: &nbsp;</span><span class="value mono"><span id="act-power-pv" style="text-shadow:0.5px 0.5px 0px rgba(32,48,64,0.5);border-bottom:1.5px solid #444"><?= htmlspecialchars($title_power_pv) ?>&nbsp;W</span>&nbsp;</span></div>
  <div class="row"><span class="label">Stromstärke (A) <span class="mobil-only"><br></span>Fließender Strom: &nbsp;</span><span class="value mono"><?= htmlspecialchars($current_pv) ?>&nbsp;A&nbsp;</span></div>
  <div class="row"><span class="label">Spannung (V) Netzspannung: &nbsp;</span><span class="value mono"><?= htmlspecialchars($voltage_pv) ?>&nbsp;V&nbsp;</span></div>
  <div class="row"><span class="label">Frequenz (Hz) Netzfrequenz: &nbsp;</span><span class="value mono"><?= htmlspecialchars($freq_pv) ?>&nbsp;Hz</span></div>
  <div class="row"><span class="label">Leistungsfaktor (pf) <br>Verhältnis Wirk‑ zu Scheinleistung: &nbsp;</span><span class="value mono"><?= htmlspecialchars($pf_pv) ?>&nbsp;pf</span></div>
  <div class="row"><span class="label">PV‑Leistung <span class="mobil-only"><br></span>pro kWp (W/kWp): &nbsp;</span><span class="value mono prokWp"><?= htmlspecialchars($power_per_kWp_f) ?>&nbsp;W/kWp</span></div>
  </div>
</div>

<!-- Shelly 3EM-63T -->
<div class="sectionbox" id="box-3em-63t">
  <div class="header"><span style="font-family: 'fa-solid'; font-weight: 900;">&#xf5ba;</span> PV:<br><div style="font-weight:400;font-size:10px;margin:0px;padding:0px">Fassade (3EM-63T)</div></div>
  <div id="shelly-3em-63t-content">
  <div class="row"><span class="label">Wirkleistung (W) <br>Nutzbare Leistung im Hausnetz: &nbsp;</span><span class="value mono"><span id="act-power-3em-63t" style="text-shadow:0.5px 0.5px 0px rgba(32,48,64,0.5);border-bottom:1.5px solid #444"><?= htmlspecialchars(($act_power_3em_63t > 0 ? '+' : '') . $act_power_f_3em_63t) ?>&nbsp;W</span>&nbsp;</span></div>
  <div class="row"><span class="label">Stromstärke (A) <span class="mobil-only"><br></span>Durchschnitt der 3‑Phasen: &nbsp;</span><span class="value mono"><?= htmlspecialchars($current_f_3em_63t) ?>&nbsp;A&nbsp;</span></div>
  <div class="row"><span class="label">Spannung (V) <span class="mobil-only"><br></span>Durchschnitt der 3‑Phasen:&nbsp;</span><span class="value mono"><?= htmlspecialchars($voltage_f_3em_63t) ?>&nbsp;V&nbsp;</span></div>
  <div class="row"><span class="label">Frequenz (Hz) Netzfrequenz: &nbsp;</span><span class="value mono"><?= htmlspecialchars($freq_f_3em_63t) ?>&nbsp;Hz</span></div>
  <div class="row"><span class="label">Leistungsfaktor (pf) <br>Durchschnitt der 3‑Phasen: &nbsp;</span><span class="value mono"><?= htmlspecialchars($pf_f_3em_63t) ?>&nbsp;pf</span></div>
  <div class="row"><span class="label">PV‑Leistung <span class="mobil-only"><br></span>pro kWp (W/kWp): &nbsp;</span><span class="value mono prokWp"><?= htmlspecialchars($power_per_kWp_f_63t) ?>&nbsp;W/kWp</span></div>
  </div>
</div>

<!-- Wallbox -->
<div class="sectionbox" id="box-wallbox">
  <div class="header"><span style="line-height:1.6em"> <span style="font-family: 'fa-solid'">&#xf5e7;</span></span> Wallbox:</div>
  <div id="wallbox-content">
  <?php if ($data_evcc && !empty($loadpoint)): ?>
    <?php if ($statusText == "<span class='emoji'>✅</span> frei"): ?>
        <div class='info-center'><i style='font-size:0.95em'>Wallbox-Nutzung auf Anfrage möglich.<br>Die Daten der letzten Ladung werden unten weiterhin angezeigt.</i></div>
    <?php endif; ?>
    
    <div class='row'><span class='label'>Status:</span><span class='value' style='color:<?= $statusColor ?>;font-weight:400;'><?= $statusText ?></span></div>
    
    <?php if ($statusText == "<span class='emoji'>✅</span> frei"): ?>
        <div class='row'><span class='label'>Fahrzeug:</span><span class='value'>–</span></div>
        <div class='row'><span class='label'>Modus:</span><span class='value'><?= $mode ?></span></div>
        <div class='row'><span class='label'>Leistung:</span><span class='value'><?= number_format((float)$power_evcc, 0, ',', '.') ?>&nbsp;W&nbsp;&nbsp;</span></div>
        <div class='row'><span class='label'>Geladen:</span><span class='value'><?= number_format($chargedEnergy / 1000, 3, ',', '.') ?>&nbsp;kWh</span></div>
        <div class='row'><span class='label'><?= $tarif_display ?><br>PV-Erträge sind unberücksichtigt.</span><span class='value'><span style='text-shadow:0.5px 0.5px 0px rgba(32,48,64,0.5);border-bottom:1.5px solid #444'><?= number_format($preis_anzeige, 2, ',', '.') ?>&nbsp;€</span>&nbsp;&nbsp;</span></div>
        <div class='row'><span class='label'>Ladedauer:</span><span class='value'><?= $duration ?></span></div>
    <?php else: ?>
        <div class='row'><span class='label'>Fahrzeug:</span><span class='value'><?= $vehicle ? $vehicle : "<em>Kein Fahrzeug erkannt</em>" ?></span></div>
        <div class='row'><span class='label'>Modus:</span><span class='value'><?= $mode ?></span></div>
        <div class='row'><span class='label'>Leistung:</span><span class='value'><?= number_format((float)$power_evcc, 0, ',', '.') ?>&nbsp;W&nbsp;&nbsp;</span></div>
        <div class='row'><span class='label'>Geladen:</span><span class='value'><?= number_format($chargedEnergy / 1000, 3, ',', '.') ?>&nbsp;kWh</span></div>
        <div class='row'><span class='label'><?= $tarif_display ?><br>PV-Erträge sind unberücksichtigt.</span><span class='value'><span style='text-shadow:0.5px 0.5px 0px rgba(32,48,64,0.5);border-bottom:1.5px solid #444'><?= number_format($preis_anzeige, 2, ',', '.') ?>&nbsp;€</span>&nbsp;&nbsp;</span></div>
        <div class='row'><span class='label'>Ladedauer:</span><span class='value'><?= $duration ?></span></div>
    <?php endif; ?>
  <?php else: ?>
    <div class='row'><span class='label'><span class='emoji'>⚠️</span> Keine Ladepunkte gefunden.</span></div>
  <?php endif; ?>
  </div>
</div>

<!-- Akku -->
<div class="sectionbox" id="box-battery">
  <div class="header"><span style="line-height:1.6em"><span style="font-family: 'fa-solid'"><?= $battery_icon ?></span></span> Stromspeicher:</div>
  <div id="battery-content">
  <?php if ($data_evcc && $battery): ?>
    <div class='row'><span class='label'>Speicherkapazität (nutzbar):</span><span class='value mono'><?= number_format($capacity, 3, ',', '.') ?> kWh</span></div>
    <div class='row'><span class='label'>Akkustand (SoC):</span><span class='value mono'><span style='border-bottom:1.5px solid #444;'><?= $soc_display ?>&nbsp;%</span>&nbsp;&nbsp;</span></div>
    <div class='row'><span class='label'>Aktuell verfügbar:</span><span class='value mono'><?= number_format($energy_total, 3, ',', '.') ?> kWh</span></div>
    <div class='row'><span class='label'>Lade- (+) Entladeleistung (-):</span><span class='value mono'><?= $power_sign ?><?= number_format(abs($power_display), 0, ',', '.') ?>&nbsp;W&nbsp;&nbsp;</span></div>
    <div class='row'><span class='label'>Nutzbar<br>abzgl.&nbsp;<?= $battery_reserve_percent ?>&nbsp;%&nbsp;Reserve:</span><span class='value mono' style='text-shadow:0.5px 0.5px 0px rgba(32,48,64,0.5);border-bottom:1.5px solid #444;color:#333'><?= $usable_soc_display ?>&nbsp;%&nbsp;&nbsp;<br><?= number_format($usable_energy, 3, ',', '.') ?>&nbsp;kWh</span></div>
    <div class='row'><span class='label'><?= $battery_status['label'] ?></span><span class='value mono'><?= $battery_status['value'] ? $battery_status['value'] : $battery_runtime ?></span></div>
  <?php else: ?>
    <div class='row'><span class='label'>Keine Batteriedaten verfügbar.</span></div>
  <?php endif; ?>
  </div>
</div>
</div>

<div class="footer">
  Stand: <span id="timestamp"><?= htmlspecialchars($timestamp) ?></span>
</div>

<script>
function updateData() {
    fetch('?ajax=1')
        .then(response => response.text())
        .then(data => {
            const parser = new DOMParser();
            const doc = parser.parseFromString(data, 'text/html');
            
            // Netzanschluss-Daten aktualisieren
            const netzanschlussContent = doc.getElementById('netzanschluss-content');
            if (netzanschlussContent) {
                document.getElementById('netzanschluss-content').innerHTML = netzanschlussContent.innerHTML;
            }
            
            // PV-Daten aktualisieren
            const pvContent = doc.getElementById('pv-content');
            if (pvContent) {
                document.getElementById('pv-content').innerHTML = pvContent.innerHTML;
            }
            
            // Shelly 3EM-63T-Daten aktualisieren
            const shelly3em63tContent = doc.getElementById('shelly-3em-63t-content');
            if (shelly3em63tContent) {
                document.getElementById('shelly-3em-63t-content').innerHTML = shelly3em63tContent.innerHTML;
            }
            
            // Wallbox-Daten aktualisieren
            const wallboxContent = doc.getElementById('wallbox-content');
            if (wallboxContent) {
                document.getElementById('wallbox-content').innerHTML = wallboxContent.innerHTML;
            }
            
            // Batterie-Daten aktualisieren
            const batteryContent = doc.getElementById('battery-content');
            if (batteryContent) {
                document.getElementById('battery-content').innerHTML = batteryContent.innerHTML;
            }
            
            // Zeitstempel aktualisieren
            const timestamp = doc.getElementById('timestamp');
            if (timestamp) {
                document.getElementById('timestamp').textContent = timestamp.textContent;
            }
            
            // Titel aktualisieren
            const titlePower3em = doc.getElementById('title-power-3em');
            const titlePowerPv = doc.getElementById('title-power-pv');
            if (titlePower3em && titlePowerPv) {
                document.title = titlePower3em.textContent + ' W / ' + titlePowerPv.textContent + ' W Netz- & PV-Leistung';
            }
            
            // Batterie-Füllstand aktualisieren
            const batteryFill = doc.getElementById('battery-fill');
            if (batteryFill) {
                document.getElementById('box-battery').style.setProperty('--battery-fill-height', batteryFill.textContent + '%');
            }
            
            // Batterie-Icon aktualisieren
            const batteryIcon = doc.getElementById('battery-icon');
            if (batteryIcon) {
                const batteryHeader = document.querySelector('#box-battery .header span');
                if (batteryHeader) {
                    batteryHeader.innerHTML = '<span style="font-family: \'fa-solid\'; font-weight: 900;">' + batteryIcon.textContent + '</span>';
                }
            }
            
            // Hintergrundfarbe aktualisieren
            const backgroundColor = doc.getElementById('background-color');
            if (backgroundColor) {
                document.body.style.backgroundColor = backgroundColor.textContent;
            }
            
            // Farben aktualisieren
            updateColors();
        })
        .catch(error => {
            console.error('Fehler beim Aktualisieren der Daten:', error);
        });
}

function updateColors() {
    // Farben
    const white=[255,255,255], green=[180,255,180], red=[240,120,140];
    const maxPower = 500, minPower = 100;
    
    function intensity(x){const n=Math.min(Math.abs(x)/maxPower,1);return Math.pow(n,0.6);}
    function rgb(arr){return `rgb(${arr.map(x=>Math.round(x)).join(",")})`;}
    
    // Netzanschluss-Box
    const actPower3EM = parseFloat(document.getElementById('act-power-3em').textContent.replace(/[^\d,-]/g, '').replace(',', '.'));
    let color3em = white;
    const value3em = document.getElementById('act-power-3em');
    
    if (actPower3EM > minPower) {
        const t = intensity(actPower3EM);
        color3em = [white[0]+(red[0]-white[0])*t,white[1]+(red[1]-white[1])*t,white[2]+(red[2]-white[2])*t];
        value3em.style.color = "#1a1a1a";
    } else if (actPower3EM < -minPower) {
        const t = intensity(actPower3EM);
        color3em = [white[0]+(green[0]-white[0])*t,white[1]+(green[1]-white[1])*t,white[2]+(green[2]-white[2])*t];
        value3em.style.color = "#222";
    } else {
        value3em.style.color = "#222";
    }
    
    // PV-Box
    const actPowerPV = parseFloat(document.getElementById('act-power-pv').textContent.replace(/[^\d,-]/g, '').replace(',', '.'));
    let colorPV = white;
    
    if (actPowerPV > 0) {
        const t = intensity(actPowerPV);
        colorPV = [white[0]+(green[0]-white[0])*t,white[1]+(green[1]-white[1])*t,white[2]+(green[2]-white[2])*t];
    }
    
    // Shelly 3EM-63T-Box
    const actPower3EM63T = parseFloat(document.getElementById('act-power-3em-63t').textContent.replace(/[^\d,-]/g, '').replace(',', '.'));
    let color3EM63T = white;
    
    if (actPower3EM63T > 0) {
        const t = intensity(actPower3EM63T);
        color3EM63T = [white[0]+(green[0]-white[0])*t,white[1]+(green[1]-white[1])*t,white[2]+(green[2]-white[2])*t];
    }
    
    // Hintergrundfarben der Boxen setzen
    document.getElementById("box-3em").style.backgroundColor = rgb(color3em);
    document.getElementById("box-pv").style.backgroundColor = rgb(colorPV);
    document.getElementById("box-3em-63t").style.backgroundColor = rgb(color3EM63T);
}

// Alle 2 Sekunden aktualisieren
setInterval(updateData, 2000);

// Sofort nach Laden der Seite erste Aktualisierung
document.addEventListener('DOMContentLoaded', function() {
    setTimeout(updateData, 100);
});

// Sofort reload bei erneutem Tab aufruf, Cache vermeiden
window.addEventListener("pageshow", e => { if (e.persisted) location.reload(); });
</script>

</body>
</html>