<template>
    <div class="smart-credit-pkg">
        <div class="link-area">
            <a :href="`${app_base_url}/login`">
                Already a member? Log In
            </a>
        </div>
        <div style="margin-top: 65%;" class="report-card p-3 report-card--best report-card__aside mt-5 report-card--info">
            <div class="report-card__header pb-3">
                <h5>
<!--                    :src="`${app_base_url}/img/smartcredit_logo.png`"-->
                    <strong> <img
                        :src="`${img_url}`"
                        alt="SmartCredit" class="provider-logo"> {{package.labels[package_id]}}</strong>
                </h5>
            </div>
            <div class="report-card__price p-2">
                <h4>${{package.prices[package_id]}}/mo</h4> <span>Cancel Anytime</span>
            </div>
            <div class="report-card__points py-2 pt-3">
                <ul class="points">
<!--                    <li><i class="fas fa-check-circle"></i> <strong>Unlimited Creditzombies-->
<!--                        Challenges</strong></li>-->
                    <li><i class="fas fa-check-circle"></i> <strong>Monthly 3 Bureau Reports &amp;
                        Scores</strong></li>
                </ul>
            </div>
            <div class="report-card__points py-2 ">
                <ul class="points">
                    <li><i class="fas fa-check-circle"></i> Identity Theft Insurance ($1m)</li>
                    <li><i class="fas fa-check-circle"></i> Credit Monitoring &amp; Alerts (TU)</li>
                    <li><i class="fas fa-check-circle"></i> ScoreTracker</li>
                    <li><i class="fas fa-check-circle"></i> ScoreBuilder</li>
                    <li><i class="fas fa-check-circle"></i> ScoreBoost</li>
                    <li><i class="fas fa-check-circle"></i> Money Manager</li>
                    <li><i class="fas fa-check-circle"></i> Smart Credit Report</li>
                    <li><i class="fas fa-check-circle"></i> PrivacyMaster</li>
                </ul>
            </div>

            <div class="report-card__text py-2">
                <p>Includes SmartCredit Money Manager with <strong>{{package.updateLimit[package_id]}}</strong> Transunion Report
                    &amp; Score updates in SmartCredit.</p>
            </div>
            <div class="report-card__action">

            </div>
        </div>
    </div>
</template>

<script>
import pkg from "../../helper/package";
export default {
    props:{
        package_id:{
            required:true
        }
    },
    data(){
        return {
            package:pkg,
            app_base_url: APP_URL,
            img_url : APP_URL+'/images/'+APP_NAME+'_logo.png',
            company_Name:COMPANY_NAME
        }
    }
}
</script>
<style>

@import url("./../../../css/smartcredit.css");

</style>
