@extends('layouts.super-admin')

@section('title', 'Real-time Monitor')
@section('page-title', 'Real-time Monitor')
@section('page-description', 'Live monitoring gempa real-time')

@section('content')
<div class="monitor-content">
    <div class="info-message">
        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor">
            <circle cx="12" cy="12" r="10"/>
            <line x1="12" y1="8" x2="12" y2="12"/>
            <circle cx="12" cy="16" r="0.5" fill="currentColor"/>
        </svg>
        <div>
            <strong>Real-time Monitor:</strong> Halaman ini akan menampilkan data gempa secara real-time.
            Fitur lengkap sedang dalam pengembangan.
        </div>
    </div>
</div>

<style>
.monitor-content {
    max-width: 1400px;
    margin: 0 auto;
}

.info-message {
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 12px;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.875rem;
    color: #1e40af;
}
</style>
@endsection