<?php
$duration = get_post_meta(get_the_ID(), '_trip_duration', true);
$desc = get_post_meta(get_the_ID(), '_trip_short_desc', true);
$terms_destination = get_the_terms(get_the_ID(), 'trip_destination');
$terms_category = get_the_terms(get_the_ID(), 'trip_cat');

$currency = (get_option('_webforia_trip_currency') == 'IDR') ? 'Rp' : '$';
$starter_price = get_post_meta(get_the_ID(), '_trip_price_min', true);
$price = wp_sprintf('<span class="rt-price__currency">%s</span>%s', $currency, number_format($starter_price, 0, ',', '.'));
$price_total = get_post_meta(get_the_ID(), '_trip_image_gallery_count', true);
?>
<div <?php post_class("rt-trip border rounded-md overflow-hidden") ?>>
    <?php if (has_post_thumbnail()) : ?>
        <figure class="rt-trip__thumbnail rt-img is-img-full my-0" style="aspect-ratio:<?php echo esc_attr(rt_get_option('post_image_ratio', '3/2')) ?>">
            <a href="<?php the_permalink() ?>" title="<?php the_title_attribute(); ?>">
                <?php the_post_thumbnail(rt_get_option('trip_image_size', 'trip_catalog'));  ?>
            </a>
        </figure>
    <?php endif ?>
    <div class="rt-trip__body is-layout-flow py-40 px-40">

        <h3 class="rt-trip__title has-medium-font-size has-link-overlay line-clamp-3">
            <a href="<?php the_permalink() ?>"><?php echo get_the_title() ?></a>
        </h3>

        <div class="rt-trip__meta is-layout-flex gap-30 has-x-small-font-size has-meta-color has-link-meta-color mt-20">
            <?php if ($terms_destination && !is_wp_error($terms_destination)) : ?>
                <div class="is-layout-flex gap-10">
                    <i class="rt-icon">
                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-geo-alt" viewBox="0 0 16 16">
                            <path d="M12.166 8.94c-.524 1.062-1.234 2.12-1.96 3.07A32 32 0 0 1 8 14.58a32 32 0 0 1-2.206-2.57c-.726-.95-1.436-2.008-1.96-3.07C3.304 7.867 3 6.862 3 6a5 5 0 0 1 10 0c0 .862-.305 1.867-.834 2.94M8 16s6-5.686 6-10A6 6 0 0 0 2 6c0 4.314 6 10 6 10" />
                            <path d="M8 8a2 2 0 1 1 0-4 2 2 0 0 1 0 4m0 1a3 3 0 1 0 0-6 3 3 0 0 0 0 6" />
                        </svg>
                    </i>
                    <div class="wp-block-post-terms is-style-dot-separator">
                        <?php foreach ($terms_destination as $term) : ?>
                            <a class="<?php echo 'destination-' . esc_attr($term->slug) ?>" href="<?php echo esc_url(get_tag_link($term->term_id)) ?>">
                                <?php echo $term->name ?>
                            </a>
                            <span class="wp-block-post-terms__separator">•</span>
                        <?php endforeach; ?>
                    </div>
                </div>
            <?php endif ?>

            <?php if ($duration): ?>
                <div class="is-layout-flex gap-10">
                    <i class="rt-icon">
                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-clock" viewBox="0 0 16 16">
                            <path d="M8 3.5a.5.5 0 0 0-1 0V9a.5.5 0 0 0 .252.434l3.5 2a.5.5 0 0 0 .496-.868L8 8.71z" />
                            <path d="M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16m7-8A7 7 0 1 1 1 8a7 7 0 0 1 14 0" />
                        </svg>
                    </i>
                    <?php echo wp_sprintf(__('%s Days', 'jelajah-text'), $duration) ?>
                </div>
            <?php endif ?>
        </div>

        <div class="rt-trip__price mt-20">
            <span class="rt-trip-price">
                <?php if ($price_total > 1): ?>
                    <span class="rt-trip-price__label"><?php echo __('From:', 'jelajah-text') ?></span>
                <?php endif ?>
                <span class="rt-trip-price__amount has-medium-font-size"><strong><?php echo $price ?></strong></span>
            </span>
        </div>

        <?php if ($desc && rt_get_option('trip_element_content', true)): ?>
            <div class="rt-trip__content has-x-small-font-size mt-30"><?php echo $desc ?></div>
        <?php endif ?>

        <?php if ($terms_category && !is_wp_error($terms_category) && rt_get_option('trip_element_category', true)) : ?>
            <div class="wp-block-post-terms is-style-colored has-xx-small-font-size">
                <?php foreach ($terms_category as $term) : ?>
                    <a class="<?php echo 'trip-category-' . esc_attr($term->slug) ?>" href="<?php echo esc_url(get_tag_link($term->term_id)) ?>">
                        <?php echo $term->name ?>
                    </a>
                <?php endforeach; ?>
            </div>
        <?php endif ?>

        <?php if (rt_get_option('post_element_readmore', true)): ?>
            <hr class="wp-block-separator">
            <a class="rt-btn mt-40" href="<?php the_permalink() ?>" title="<?php the_title_attribute(); ?>"><?php echo __('View Details', 'jelajah-text') ?></a>
        <?php endif ?>
    </div>
</div>