{% if saved_paypal %}
Cuenta PayPal guardada:
@@ -221,12 +225,42 @@ const HAS_STOCK_ISSUES = {{ stock_issues|yesno:"true,false" }};
const HAS_ADDRESS = {{ addresses|yesno:"true,false" }};
// ---- Tab switching ----
-document.querySelectorAll('#paymentTabs .nav-link').forEach(btn => {
- btn.addEventListener('click', () => {
- document.querySelectorAll('#paymentTabs .nav-link').forEach(b => b.classList.remove('active'));
- document.querySelectorAll('.payment-tab-content').forEach(p => p.classList.remove('active'));
- btn.classList.add('active');
- document.getElementById(btn.dataset.tab).classList.add('active');
+const paymentTabs = Array.from(document.querySelectorAll('#paymentTabs .nav-link[role="tab"]'));
+
+function activateTab(tab) {
+ paymentTabs.forEach(b => {
+ const isSelected = b === tab;
+ b.classList.toggle('active', isSelected);
+ b.setAttribute('aria-selected', isSelected ? 'true' : 'false');
+ b.setAttribute('tabindex', isSelected ? '0' : '-1');
+ });
+ document.querySelectorAll('.payment-tab-content').forEach(p => p.classList.remove('active'));
+ document.getElementById(tab.dataset.tab).classList.add('active');
+}
+
+paymentTabs.forEach(btn => {
+ btn.addEventListener('click', () => activateTab(btn));
+ btn.addEventListener('keydown', e => {
+ const idx = paymentTabs.indexOf(e.currentTarget);
+ if (e.key === 'ArrowRight') {
+ e.preventDefault();
+ const next = paymentTabs[(idx + 1) % paymentTabs.length];
+ activateTab(next);
+ next.focus();
+ } else if (e.key === 'ArrowLeft') {
+ e.preventDefault();
+ const prev = paymentTabs[(idx - 1 + paymentTabs.length) % paymentTabs.length];
+ activateTab(prev);
+ prev.focus();
+ } else if (e.key === 'Home') {
+ e.preventDefault();
+ activateTab(paymentTabs[0]);
+ paymentTabs[0].focus();
+ } else if (e.key === 'End') {
+ e.preventDefault();
+ activateTab(paymentTabs[paymentTabs.length - 1]);
+ paymentTabs[paymentTabs.length - 1].focus();
+ }
});
});