<?php
$icon_type = isset($attributes['iconType']) ? sanitize_key($attributes['iconType']) : 'truck';
$custom_icon_url = isset($attributes['customIconUrl']) ? esc_url($attributes['customIconUrl']) : '';
$text = isset($attributes['text']) ? (string) $attributes['text'] : '';
$background_color = isset($attributes['backgroundColor']) ? (string) $attributes['backgroundColor'] : '';
$text_color = isset($attributes['textColor']) ? (string) $attributes['textColor'] : '';

$icons = [
  'truck' => '<svg viewBox="0 0 24 24" focusable="false"><path d="M3 7h11v8H3z" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linejoin="round"></path><path d="M14 10h4l3 3v2h-7z" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linejoin="round"></path><circle cx="7" cy="18" r="1.6" fill="none" stroke="currentColor" stroke-width="1.6"></circle><circle cx="18" cy="18" r="1.6" fill="none" stroke="currentColor" stroke-width="1.6"></circle></svg>',
  'globe' => '<svg viewBox="0 0 24 24" focusable="false"><path d="M12 2a10 10 0 1 0 10 10A10 10 0 0 0 12 2Z" fill="none" stroke="currentColor" stroke-width="1.6"></path><path d="M2 12h20" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"></path><path d="M12 2c2.8 3.2 2.8 14.8 0 20-2.8-3.2-2.8-14.8 0-20Z" fill="none" stroke="currentColor" stroke-width="1.6"></path></svg>',
  'box' => '<svg viewBox="0 0 24 24" focusable="false"><path d="M4 8l8-4 8 4-8 4-8-4Z" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linejoin="round"></path><path d="M4 8v8l8 4 8-4V8" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linejoin="round"></path><path d="M12 12v8" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"></path></svg>',
  'warranty' => '<svg viewBox="0 0 24 24" focusable="false"><path d="M4 12h16a2 2 0 0 1 2 2v4H2v-4a2 2 0 0 1 2-2Z" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linejoin="round"></path><path d="M6 12V9a3 3 0 0 1 3-3h6a3 3 0 0 1 3 3v3" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"></path><path d="M4 18v2m16-2v2" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"></path></svg>',
  'creditcard' => '<svg viewBox="0 0 24 24" focusable="false"><rect x="2" y="5" width="20" height="14" rx="2" fill="none" stroke="currentColor" stroke-width="1.6"></rect><path d="M2 9h20" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"></path><path d="M6 15h6" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"></path></svg>',
  'shield' => '<svg viewBox="0 0 24 24" focusable="false"><path d="M12 3l7 3v6c0 4.4-3 7.8-7 9-4-1.2-7-4.6-7-9V6l7-3Z" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linejoin="round"></path></svg>',
  'star' => '<svg viewBox="0 0 24 24" focusable="false"><path d="M12 3.5l2.6 5.3 5.9.9-4.3 4.2 1 5.8L12 16.9 6.8 19.7l1-5.8L3.5 9.7l5.9-.9L12 3.5Z" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linejoin="round"></path></svg>',
  'leaf' => '<svg viewBox="0 0 24 24" focusable="false"><path d="M5 19c8-1 12-6 14-14-8 2-13 6-14 14Z" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linejoin="round"></path><path d="M9 15c2-3 5-5 9-7" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"></path></svg>',
  'clock' => '<svg viewBox="0 0 24 24" focusable="false"><circle cx="12" cy="12" r="9" fill="none" stroke="currentColor" stroke-width="1.6"></circle><path d="M12 7v5l3 2" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"></path></svg>',
  'phone' => '<svg viewBox="0 0 24 24" focusable="false"><path d="M6 4h4l1 4-2 2c1.5 2.8 3.7 5 6.5 6.5l2-2 4 1v4c0 1.1-.9 2-2 2C10.3 21.5 2.5 13.7 2.5 4c0-1.1.9-2 2-2Z" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linejoin="round"></path></svg>',
  'heart' => '<svg viewBox="0 0 24 24" focusable="false"><path d="M12 20s-7-4.5-7-9a4 4 0 0 1 7-2.6A4 4 0 0 1 19 11c0 4.5-7 9-7 9Z" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linejoin="round"></path></svg>',
  'check' => '<svg viewBox="0 0 24 24" focusable="false"><path d="M5 12l4 4 10-10" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"></path></svg>',
  'tag' => '<svg viewBox="0 0 24 24" focusable="false"><path d="M3 10l7-7h7l4 4v7l-7 7-11-11Z" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linejoin="round"></path><circle cx="15" cy="7" r="1.6" fill="none" stroke="currentColor" stroke-width="1.6"></circle></svg>',
  'gift' => '<svg viewBox="0 0 24 24" focusable="false"><path d="M3 10h18v10H3z" fill="none" stroke="currentColor" stroke-width="1.6"></path><path d="M12 10v10M3 10h18M7 10c-2.2 0-3.5-1.3-3.5-2.7C3.5 5.8 4.8 4.5 6.6 4.5c2.1 0 3.6 2.3 4.4 5.5M17 10c2.2 0 3.5-1.3 3.5-2.7 0-1.5-1.3-2.8-3.1-2.8-2.1 0-3.6 2.3-4.4 5.5" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"></path></svg>',
  'lock' => '<svg viewBox="0 0 24 24" focusable="false"><rect x="4" y="10" width="16" height="10" rx="2" fill="none" stroke="currentColor" stroke-width="1.6"></rect><path d="M8 10V7a4 4 0 0 1 8 0v3" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"></path></svg>',
  'recycle' => '<svg viewBox="0 0 24 24" focusable="false"><path d="M7 7l2-3 2 3M6 7h5M17 17l-2 3-2-3M18 17h-5M12 8l3 5-3 5-3-5 3-5Z" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"></path></svg>',
];

$icon_markup = '';
if ($icon_type === 'custom' && $custom_icon_url) {
  $icon_markup = '<img src="' . $custom_icon_url . '" alt="" style="width:100%;height:100%;object-fit:contain;">';
} else {
  $icon_markup = $icons[$icon_type] ?? $icons['truck'];
}

$styles = [];
if ($background_color !== '') {
  $styles[] = 'background-color:' . $background_color;
}
if ($text_color !== '') {
  $styles[] = 'color:' . $text_color;
}

$style_attr = $styles ? ' style="' . esc_attr(implode(';', $styles)) . '"' : '';
?>
<div class="fjord-info__item"<?php echo $style_attr; ?>>
  <span class="fjord-info__icon" aria-hidden="true">
    <?php echo $icon_markup; ?>
  </span>
  <span><?php echo esc_html($text); ?></span>
</div>
