<div class="description">
    <p>
        Subscribing to a calendar adds it to your Kithkin calendar set and syncs any changes back to the original service. This means that any changes you make here will be sent to that server, and vice versa.
    <p>
        It's possible (and likely) that some of the things you can add to your calendar here will not work in other calendar apps or services. You'll always see that data here, though.
    </p>
</div>
<form method="post" action="{{ route('subscriptions.store') }}" class="settings">
    @csrf

    <div class="input-row input-row--1">
        <div class="input-cell">
            <x-input.text-label
                name="source"
                type="url"
                label="{{ __('Calendar URL (ICS)') }}"
                placeholder="https://ical.mac.com/ical/MoonPhases.ics"
                required="true"
            />
        </div>
    </div>
    <div class="input-row input-row--1">
        <div class="input-cell">
            <x-input.text-label
                name="displayname"
                type="text"
                label="{{ __('Display name') }}"
                placeholder="Phases of the moon..."
                required="true"
                description="If you leave this blank, we'll try to make a best guess for the name."
            />
        </div>
    </div>
    <div class="input-row input-row--1">
        <div class="input-cell">
            <x-input.text-label
                name="color"
                type="color"
                value="#06D2A1"
                label="{{ __('Calendar color') }}"
            />
        </div>
    </div>
    <div class="input-row input-row--actions input-row--start sticky-bottom">
        <x-button variant="primary" type="submit">{{ __('Subscribe') }}</x-button>
        <x-button type="anchor" variant="tertiary" href="{{ route('calendar.settings.subscribe') }}">{{ __('common.cancel') }}</x-button>
    </div>
</form>
