@version(2)

@php
$shp_cur_base = $shp_base_currency;
$shp_cur_now = $shp_currency;
$shp_cur_list = $shp_currency_choices ?? [];
@endphp

@if (count($shp_cur_list) > 1)
<div class="shp-currency-bar" style="display:flex;justify-content:flex-end;align-items:center;margin:0 10px 6px auto">
	<select id="shpCurrencySelect" aria-label="{{ $lang->shop_currency_select ?? '통화 선택' }}" style="appearance:none;-webkit-appearance:none;width:auto;min-width:0;padding:7px 30px 7px 14px;border:1px solid #d5dae1;border-radius:999px;font-size:13px;font-weight:600;background:#fff url('data:image/svg+xml;utf8,<svg xmlns=%22http://www.w3.org/2000/svg%22 width=%2210%22 height=%226%22><path d=%22M1 1l4 4 4-4%22 stroke=%22%236b7684%22 stroke-width=%221.6%22 fill=%22none%22 stroke-linecap=%22round%22/></svg>') no-repeat right 12px center;color:#333d4b;cursor:pointer">
		@foreach ($shp_cur_list as $shp_cc => $shp_cs)
		<option value="{{ $shp_cc }}" @if ($shp_cc === $shp_cur_now) selected @endif>{{ $shp_cs }}</option>
		@endforeach
	</select>
</div>

<div id="shpCurrencyModal" style="display:none;position:fixed;inset:0;z-index:9990;align-items:center;justify-content:center">
	<div style="position:absolute;inset:0;background:rgba(20,23,28,.55)" data-shp-cur-close></div>
	<div role="dialog" aria-modal="true" style="position:relative;background:#fff;border-radius:16px;padding:26px 24px;width:min(92vw,360px);box-shadow:0 20px 60px rgba(0,0,0,.25)">
		<h3 style="margin:0 0 6px;font-size:17px;color:#191f28">Choose your currency</h3>
		<p style="margin:0 0 16px;font-size:13px;color:#6b7684">We can show prices in your local currency.<br />{{ $lang->shop_currency_local }}</p>
		<div style="display:flex;flex-direction:column;gap:8px">
			<button type="button" id="shpCurSuggestBtn" class="shp-btn shp-btn-primary" style="width:100%"></button>
			<button type="button" class="shp-btn" style="width:100%" data-shp-cur-close>{{ $shp_cur_list[$shp_cur_base] ?? $shp_cur_base }} ({{ $lang->shop_currency_keep ?? '그대로 보기' }})</button>
		</div>
	</div>
</div>

<script>
(function () {
	var sel = document.getElementById('shpCurrencySelect');
	if (!sel) return;
	function setCurrency(code) {
		document.cookie = 'shp_currency=' + code + '; path=/; max-age=31536000; samesite=lax';
		window.location.reload();
	}
	sel.addEventListener('change', function () { setCurrency(this.value); });

	var base = '{{ $shp_cur_base }}';
	var offered = [];
	for (var i = 0; i < sel.options.length; i++) offered.push(sel.options[i].value);
	var hasCookie = /(?:^|;\s*)shp_currency=/.test(document.cookie);
	var prompted = false;
	try { prompted = localStorage.getItem('shp_cur_prompted') === '1'; } catch (e) {}
	if (hasCookie || prompted) return;

	var byRegion = { KR:'KRW', US:'USD', JP:'JPY', CN:'CNY', TW:'TWD', HK:'HKD', GB:'GBP', AU:'AUD', CA:'CAD', CH:'CHF', SG:'SGD', TH:'THB', VN:'VND', PH:'PHP', ID:'IDR', MY:'MYR', IN:'INR', MX:'MXN', BR:'BRL', NZ:'NZD', SE:'SEK', NO:'NOK', DK:'DKK', PL:'PLN', CZ:'CZK', HU:'HUF', AE:'AED', SA:'SAR', IL:'ILS', TR:'TRY', ZA:'ZAR', DE:'EUR', FR:'EUR', ES:'EUR', IT:'EUR', NL:'EUR', PT:'EUR', AT:'EUR', BE:'EUR', FI:'EUR', IE:'EUR', GR:'EUR' };
	var byLang = { ko:'KRW', ja:'JPY', th:'THB', vi:'VND', id:'IDR', ms:'MYR', hi:'INR', pt:'BRL', sv:'SEK', nb:'NOK', da:'DKK', pl:'PLN', cs:'CZK', hu:'HUF', ar:'SAR', he:'ILS', tr:'TRY', de:'EUR', fr:'EUR', it:'EUR', nl:'EUR', el:'EUR', es:'EUR' };
	var tag = (navigator.language || '').split('-');
	var guess = (tag[1] && byRegion[tag[1].toUpperCase()]) || byLang[(tag[0] || '').toLowerCase()] || '';
	if (!guess || guess === base || offered.indexOf(guess) < 0) return;

	var modal = document.getElementById('shpCurrencyModal');
	var suggest = document.getElementById('shpCurSuggestBtn');
	if (!modal || !suggest) return;
	var sym = '';
	for (var j = 0; j < sel.options.length; j++) {
		if (sel.options[j].value === guess) sym = sel.options[j].textContent.trim();
	}
	suggest.textContent = {!! json_encode($lang->shop_currency_view) !!}.replace('%s', sym || guess);
	try { localStorage.setItem('shp_cur_prompted', '1'); } catch (e) {}
	suggest.addEventListener('click', function () {
		try { localStorage.setItem('shp_cur_prompted', '1'); } catch (e) {}
		setCurrency(guess);
	});
	modal.querySelectorAll('[data-shp-cur-close]').forEach(function (el) {
		el.addEventListener('click', function () {
			try { localStorage.setItem('shp_cur_prompted', '1'); } catch (e) {}
			modal.style.display = 'none';
		});
	});
	modal.style.display = 'flex';
})();
</script>
@endif