@props([
    'nitroBranchesHtml',
    'nitroStatusHtml',
])

<div style="display:grid;grid-template-columns:repeat(2,1fr);gap:12px;">
    <div>
        <label style="display:block;font-size:12px;font-weight:600;color:#475569;margin-bottom:6px;">{{ __('commandocentrum.client_path') }}</label>
        <input type="text" wire:model="data.nitro_client_path" placeholder="/var/www/atomcms/nitro-client" style="width:100%;padding:10px 12px;border:1px solid #e2e8f0;border-radius:8px;font-size:13px;" />
    </div>
    <div>
        <label style="display:block;font-size:12px;font-weight:600;color:#475569;margin-bottom:6px;">{{ __('commandocentrum.renderer_path') }}</label>
        <input type="text" wire:model="data.nitro_renderer_path" placeholder="/var/www/atomcms/nitro-renderer" style="width:100%;padding:10px 12px;border:1px solid #e2e8f0;border-radius:8px;font-size:13px;" />
    </div>
    <div>
        <label style="display:block;font-size:12px;font-weight:600;color:#475569;margin-bottom:6px;">{{ __('commandocentrum.build_path') }}</label>
        <input type="text" wire:model="data.nitro_build_path" placeholder="/var/www/atomcms/nitro-client/dist" style="width:100%;padding:10px 12px;border:1px solid #e2e8f0;border-radius:8px;font-size:13px;" />
    </div>
    <div>
        <label style="display:block;font-size:12px;font-weight:600;color:#475569;margin-bottom:6px;">{{ __('commandocentrum.webroot') }}</label>
        <input type="text" wire:model="data.nitro_webroot" placeholder="/var/www/Client" style="width:100%;padding:10px 12px;border:1px solid #e2e8f0;border-radius:8px;font-size:13px;" />
    </div>
    <div>
        <label style="display:block;font-size:12px;font-weight:600;color:#475569;margin-bottom:6px;">{{ __('commandocentrum.github_url') }}</label>
        <input type="text" wire:model="data.nitro_github_url" placeholder="https://github.com/..." style="width:100%;padding:10px 12px;border:1px solid #e2e8f0;border-radius:8px;font-size:13px;" />
    </div>
    <div>
        <label style="display:block;font-size:12px;font-weight:600;color:#475569;margin-bottom:6px;">{{ __('commandocentrum.branch') }}</label>
        <select wire:model="data.nitro_github_branch" style="width:100%;padding:10px 12px;border:1px solid #e2e8f0;border-radius:8px;font-size:13px;background:#fff;">
            {!! $nitroBranchesHtml !!}
        </select>
    </div>
    <div>
        <label style="display:block;font-size:12px;font-weight:600;color:#475569;margin-bottom:6px;">{{ __('commandocentrum.site_url') }}</label>
        <input type="text" wire:model="data.nitro_site_url" placeholder="https://hotel.nl" style="width:100%;padding:10px 12px;border:1px solid #e2e8f0;border-radius:8px;font-size:13px;" />
    </div>
    <div>
        <label style="display:block;font-size:12px;font-weight:600;color:#475569;margin-bottom:6px;">{{ __('commandocentrum.status') }}</label>
        {!! $nitroStatusHtml !!}
    </div>
</div>