{{-- How renewal works, in four lines: on the domain search and domain
     pricing pages. Folded away unless $open, so it does not crowd the search.
     The reminder days are DomainRenewalReminderCommand's. --}}
<details class="rn-notes" @if($open ?? false) open @endif>
    <summary><i class="ri-information-line"></i> {{ __("client.domain_search.legend_title") }} <i class="ri-arrow-down-s-line rn-notes__chev"></i></summary>
    <ul>
        <li><i class="ri-mail-line"></i><span>{{ __("client.domain_search.legend_notice") }}</span></li>
        <li><i class="ri-time-line"></i><span>{{ __("client.domain_search.legend_grace") }}</span></li>
        <li><i class="ri-refund-2-line"></i><span>{{ __("client.domain_search.legend_restore") }}</span></li>
        <li class="rn-notes__warn"><i class="ri-error-warning-line"></i><span>{{ __("client.domain_search.legend_local") }}</span></li>
    </ul>
</details>
<style>
    .rn-notes{background:var(--card);border:1px solid var(--border);border-radius:12px;margin-top:20px}
    .rn-notes summary{display:flex;align-items:center;gap:8px;padding:14px 20px;font-size:14px;font-weight:600;color:var(--text);cursor:pointer;list-style:none}
    .rn-notes summary::-webkit-details-marker{display:none}
    .rn-notes summary i{font-size:17px;color:var(--primary)}
    .rn-notes__chev{margin-left:auto;color:var(--muted)!important;transition:transform .2s}
    .rn-notes[open] .rn-notes__chev{transform:rotate(180deg)}
    .rn-notes ul{list-style:none;margin:0;padding:0 20px 16px;display:grid;gap:10px}
    .rn-notes li{display:flex;gap:10px;font-size:13px;color:var(--muted);line-height:1.5}
    .rn-notes li i{font-size:15px;color:var(--primary);flex:0 0 auto;margin-top:1px}
    .rn-notes li.rn-notes__warn{color:var(--text)}
    .rn-notes li.rn-notes__warn i{color:#d97706}
</style>