@extends('layouts.master')
@section('content')
    <main class="grow pt-5" id="content" role="content">
        <!-- Container -->
        <div class="kt-container-fixed" id="contentContainer">
        </div>
        <!-- End of Container -->
        {{-- <div
            class="flex items-center flex-wrap md:flex-nowrap lg:items-end justify-between border-b border-b-border gap-3 lg:gap-6 mb-5 lg:mb-10">
            <div class="kt-container-fixed" id="hero_container">
                <div class="grid">
                    <div class="kt-scrollable-x-auto">
                        <div class="kt-menu gap-3" data-kt-menu="true">
                            <div class="kt-menu-item border-b-2 border-b-transparent kt-menu-item-active:border-b-primary kt-menu-item-here:border-b-primary"
                                data-kt-menu-item-overflow="true" data-kt-menu-item-placement="bottom-start"
                                data-kt-menu-item-placement-rtl="bottom-end" data-kt-menu-item-toggle="dropdown"
                                data-kt-menu-item-trigger="click|lg:hover">
                                <div class="kt-menu-link gap-1.5 pb-2 lg:pb-4 px-2">
                                    <span
                                        class="kt-menu-title text-nowrap text-sm text-secondary-foreground kt-menu-item-active:text-primary kt-menu-item-active:font-medium kt-menu-item-here:text-primary kt-menu-item-here:font-medium kt-menu-item-show:text-primary kt-menu-link-hover:text-primary">
                                        Account Home
                                    </span>
                                    <span class="kt-menu-arrow">
                                        <i
                                            class="ki-filled ki-down text-xs text-muted-foreground menu-item-active:text-primary kt-menu-item-here:text-primary menu-item-show:text-primary kt-menu-link-hover:text-primary">
                                        </i>
                                    </span>
                                </div>
                                <div class="kt-menu-dropdown kt-menu-default py-2 min-w-[200px]">
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/home/get-started.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Get Started
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/home/user-profile.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                User Profile
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/home/company-profile.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Company Profile
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/home/settings-sidebar.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Settings - With Sidebar
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/home/settings-enterprise.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Settings - Enterprise
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/home/settings-plain.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Settings - Plain
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/home/settings-modal.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Settings - Modal
                                            </span>
                                        </a>
                                    </div>
                                </div>
                            </div>
                            <div class="kt-menu-item border-b-2 border-b-transparent kt-menu-item-active:border-b-primary kt-menu-item-here:border-b-primary"
                                data-kt-menu-item-overflow="true" data-kt-menu-item-placement="bottom-start"
                                data-kt-menu-item-placement-rtl="bottom-end" data-kt-menu-item-toggle="dropdown"
                                data-kt-menu-item-trigger="click|lg:hover">
                                <div class="kt-menu-link gap-1.5 pb-2 lg:pb-4 px-2">
                                    <span
                                        class="kt-menu-title text-nowrap text-sm text-secondary-foreground kt-menu-item-active:text-primary kt-menu-item-active:font-medium kt-menu-item-here:text-primary kt-menu-item-here:font-medium kt-menu-item-show:text-primary kt-menu-link-hover:text-primary">
                                        Billing
                                    </span>
                                    <span class="kt-menu-arrow">
                                        <i
                                            class="ki-filled ki-down text-xs text-muted-foreground menu-item-active:text-primary kt-menu-item-here:text-primary menu-item-show:text-primary kt-menu-link-hover:text-primary">
                                        </i>
                                    </span>
                                </div>
                                <div class="kt-menu-dropdown kt-menu-default py-2 min-w-[200px]">
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/billing/basic.html" tabindex="0">
                                            <span class="kt-menu-title">
                                                Billing - Basic
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/billing/enterprise.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Billing - Enterprise
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/billing/plans.html" tabindex="0">
                                            <span class="kt-menu-title">
                                                Plans
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/billing/history.html" tabindex="0">
                                            <span class="kt-menu-title">
                                                Billing History
                                            </span>
                                        </a>
                                    </div>
                                </div>
                            </div>
                            <div class="kt-menu-item border-b-2 border-b-transparent kt-menu-item-active:border-b-primary kt-menu-item-here:border-b-primary"
                                data-kt-menu-item-overflow="true" data-kt-menu-item-placement="bottom-start"
                                data-kt-menu-item-placement-rtl="bottom-end" data-kt-menu-item-toggle="dropdown"
                                data-kt-menu-item-trigger="click|lg:hover">
                                <div class="kt-menu-link gap-1.5 pb-2 lg:pb-4 px-2">
                                    <span
                                        class="kt-menu-title text-nowrap text-sm text-secondary-foreground kt-menu-item-active:text-primary kt-menu-item-active:font-medium kt-menu-item-here:text-primary kt-menu-item-here:font-medium kt-menu-item-show:text-primary kt-menu-link-hover:text-primary">
                                        Security
                                    </span>
                                    <span class="kt-menu-arrow">
                                        <i
                                            class="ki-filled ki-down text-xs text-muted-foreground menu-item-active:text-primary kt-menu-item-here:text-primary menu-item-show:text-primary kt-menu-link-hover:text-primary">
                                        </i>
                                    </span>
                                </div>
                                <div class="kt-menu-dropdown kt-menu-default py-2 min-w-[200px]">
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/security/get-started.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Get Started
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/security/overview.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Security Overview
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/security/allowed-ip-addresses.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Allowed IP Addresses
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/security/privacy-settings.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Privacy Settings
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/security/device-management.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Device Management
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/security/backup-and-recovery.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Backup & Recovery
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/security/current-sessions.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Current Sessions
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/security/security-log.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Security Log
                                            </span>
                                        </a>
                                    </div>
                                </div>
                            </div>
                            <div class="kt-menu-item border-b-2 border-b-transparent kt-menu-item-active:border-b-primary kt-menu-item-here:border-b-primary"
                                data-kt-menu-item-overflow="true" data-kt-menu-item-placement="bottom-start"
                                data-kt-menu-item-placement-rtl="bottom-end" data-kt-menu-item-toggle="dropdown"
                                data-kt-menu-item-trigger="click|lg:hover">
                                <div class="kt-menu-link gap-1.5 pb-2 lg:pb-4 px-2">
                                    <span
                                        class="kt-menu-title text-nowrap text-sm text-secondary-foreground kt-menu-item-active:text-primary kt-menu-item-active:font-medium kt-menu-item-here:text-primary kt-menu-item-here:font-medium kt-menu-item-show:text-primary kt-menu-link-hover:text-primary">
                                        Members & Roles
                                    </span>
                                    <span class="kt-menu-arrow">
                                        <i
                                            class="ki-filled ki-down text-xs text-muted-foreground menu-item-active:text-primary kt-menu-item-here:text-primary menu-item-show:text-primary kt-menu-link-hover:text-primary">
                                        </i>
                                    </span>
                                </div>
                                <div class="kt-menu-dropdown kt-menu-default py-2 min-w-[200px]">
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/members/team-starter.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Teams Starter
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/members/teams.html" tabindex="0">
                                            <span class="kt-menu-title">
                                                Teams
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/members/team-info.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Team Info
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/members/members-starter.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Members Starter
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/members/team-members.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Team Members
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/members/import-members.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Import Members
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/members/roles.html" tabindex="0">
                                            <span class="kt-menu-title">
                                                Roles
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/members/permissions-toggle.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Permissions - Toggler
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/members/permissions-check.html"
                                            tabindex="0">
                                            <span class="kt-menu-title">
                                                Permissions - Check
                                            </span>
                                        </a>
                                    </div>
                                </div>
                            </div>
                            <div
                                class="kt-menu-item border-b-2 border-b-transparent kt-menu-item-active:border-b-primary kt-menu-item-here:border-b-primary active">
                                <a class="kt-menu-link gap-1.5 pb-2 lg:pb-4 px-2"
                                    href="html/demo1/account/integrations.html">
                                    <span
                                        class="kt-menu-title text-nowrap font-medium text-sm text-secondary-foreground kt-menu-item-active:text-primary kt-menu-item-active:font-semibold kt-menu-item-here:text-primary kt-menu-item-here:font-semibold kt-menu-item-show:text-primary kt-menu-link-hover:text-primary">
                                        Integrations
                                    </span>
                                </a>
                            </div>
                            <div
                                class="kt-menu-item border-b-2 border-b-transparent kt-menu-item-active:border-b-primary kt-menu-item-here:border-b-primary">
                                <a class="kt-menu-link gap-1.5 pb-2 lg:pb-4 px-2"
                                    href="html/demo1/account/notifications.html">
                                    <span
                                        class="kt-menu-title text-nowrap font-medium text-sm text-secondary-foreground kt-menu-item-active:text-primary kt-menu-item-active:font-semibold kt-menu-item-here:text-primary kt-menu-item-here:font-semibold kt-menu-item-show:text-primary kt-menu-link-hover:text-primary">
                                        Notifications
                                    </span>
                                </a>
                            </div>
                            <div
                                class="kt-menu-item border-b-2 border-b-transparent kt-menu-item-active:border-b-primary kt-menu-item-here:border-b-primary">
                                <a class="kt-menu-link gap-1.5 pb-2 lg:pb-4 px-2" href="html/demo1/account/api-keys.html">
                                    <span
                                        class="kt-menu-title text-nowrap font-medium text-sm text-secondary-foreground kt-menu-item-active:text-primary kt-menu-item-active:font-semibold kt-menu-item-here:text-primary kt-menu-item-here:font-semibold kt-menu-item-show:text-primary kt-menu-link-hover:text-primary">
                                        API Keys
                                    </span>
                                </a>
                            </div>
                            <div class="kt-menu-item border-b-2 border-b-transparent kt-menu-item-active:border-b-primary kt-menu-item-here:border-b-primary"
                                data-kt-menu-item-overflow="true" data-kt-menu-item-placement="bottom-start"
                                data-kt-menu-item-placement-rtl="bottom-end" data-kt-menu-item-toggle="dropdown"
                                data-kt-menu-item-trigger="click|lg:hover">
                                <div class="kt-menu-link gap-1.5 pb-2 lg:pb-4 px-2">
                                    <span
                                        class="kt-menu-title text-nowrap text-sm text-secondary-foreground kt-menu-item-active:text-primary kt-menu-item-active:font-medium kt-menu-item-here:text-primary kt-menu-item-here:font-medium kt-menu-item-show:text-primary kt-menu-link-hover:text-primary">
                                        More
                                    </span>
                                    <span class="kt-menu-arrow">
                                        <i
                                            class="ki-filled ki-down text-xs text-muted-foreground menu-item-active:text-primary kt-menu-item-here:text-primary menu-item-show:text-primary kt-menu-link-hover:text-primary">
                                        </i>
                                    </span>
                                </div>
                                <div class="kt-menu-dropdown kt-menu-default py-2 min-w-[200px]">
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/appearance.html" tabindex="0">
                                            <span class="kt-menu-title">
                                                Appearance
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/invite-a-friend.html" tabindex="0">
                                            <span class="kt-menu-title">
                                                Invite a Friend
                                            </span>
                                        </a>
                                    </div>
                                    <div class="kt-menu-item">
                                        <a class="kt-menu-link" href="html/demo1/account/activity.html" tabindex="0">
                                            <span class="kt-menu-title">
                                                Activity
                                            </span>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div> --}}
        <!-- Container -->
        <div class="kt-container-fixed">
            <div class="flex flex-wrap items-center lg:items-end justify-between gap-5 pb-7.5">
                <div class="flex flex-col justify-center gap-2">
                    <h1 class="text-xl font-medium leading-none text-mono">
                        {{ __('translation.dashboard.myApps') }}
                    </h1>
                    {{-- <div class="flex items-center gap-2 text-sm font-normal text-secondary-foreground">
                        Enhance Workflows with Advanced Integrations.
                    </div> --}}
                </div>
                <!-- <div class="flex items-center gap-2.5">
                        <a class="kt-btn kt-btn-outline" href="#">
                            Request New App
                        </a>
                    </div> -->
            </div>
        </div>
        <!-- End of Container -->
        <!-- Container -->
        <div class="kt-container-fixed">
            <div class="grid gap-5 lg:gap-7.5">
                <!-- begin: cards -->
                <div id="integrations_cards">
                    <div class="grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3 gap-5 lg:gap-7.5">

                        {{-- Loop DB modules --}}
                        @foreach($dashboardModules as $module)
                            <x-integration-card :provider="$module->slug" :name="$module->translation_name"
                                :description="$module->translation_description" :showButton="true"
                                :route="$module->route_name" />
                        @endforeach

                    </div>
                </div>
                <!-- end: cards -->
                {{-- <div class="kt-card">
                    <div class="kt-card-content flex flex-col items-center gap-2.5 py-7.5">
                        <div class="flex justify-center p-7.5 py-9">
                            <img alt="image" class="dark:hidden max-h-[230px]" src="assets/media/illustrations/28.svg" />
                            <img alt="image" class="light:hidden max-h-[230px]"
                                src="assets/media/illustrations/28-dark.svg" />
                        </div>
                        <div class="flex flex-col gap-5 lg:gap-7.5">
                            <div class="flex flex-col gap-3 text-center">
                                <h2 class="text-xl font-semibold text-mono">
                                    Add New Integration
                                </h2>
                                <p class="text-sm text-foreground">
                                    Explore New Integration: Expand Your Toolkit with Cutting-Edge,
                                    <br />
                                    User-Friendly Solutions Tailored for Efficient and Innovative Project
                                    Management.
                                </p>
                            </div>
                            <div class="flex justify-center mb-5">
                                <a class="kt-btn kt-btn-primary" href="html/demo1/network/user-cards/mini-cards.html">
                                    Start Now
                                </a>
                            </div>
                        </div>
                    </div>
                </div> --}}
                {{-- <div class="kt-card">
                    <div class="kt-card-header">
                        <h3 class="kt-card-title">
                            FAQ
                        </h3>
                    </div>
                    <div class="kt-card-content py-3">
                        <div data-kt-accordion="true" data-kt-accordion-expand-all="true">
                            <div class="kt-accordion-item not-last:border-b border-b-border" data-kt-accordion-item="true">
                                <button aria-controls="faq_1_content" class="kt-accordion-toggle py-4"
                                    data-kt-accordion-toggle="#faq_1_content">
                                    <span class="text-base text-mono">
                                        How is pricing determined for each plan?
                                    </span>
                                    <span class="kt-accordion-active:hidden inline-flex">
                                        <i class="ki-filled ki-plus text-muted-foreground text-sm">
                                        </i>
                                    </span>
                                    <span class="kt-accordion-active:inline-flex hidden">
                                        <i class="ki-filled ki-minus text-muted-foreground text-sm">
                                        </i>
                                    </span>
                                </button>
                                <div class="kt-accordion-content hidden" id="faq_1_content">
                                    <div class="text-secondary-foreground text-base pb-4">
                                        Metronic embraces flexible licensing options that empower you to choose
                                        the perfect fit for your project's needs and budget. Understanding the
                                        factors influencing each plan's pricing helps you make an informed
                                        decision. Metronic embraces flexible licensing options that empower you
                                        to choose the perfect fit for your project's needs and budget.
                                        Understanding the factors influencing each plan's pricing helps you make
                                        an informed decision. Metronic embraces flexible licensing options that
                                        empower you to choose the perfect fit for your project's needs and
                                        budget. Understanding the factors influencing each plan's pricing helps
                                        you make an informed decision
                                    </div>
                                </div>
                            </div>
                            <div class="kt-accordion-item not-last:border-b border-b-border" data-kt-accordion-item="true">
                                <button aria-controls="faq_2_content" class="kt-accordion-toggle py-4"
                                    data-kt-accordion-toggle="#faq_2_content">
                                    <span class="text-base text-mono">
                                        What payment methods are accepted for subscriptions?
                                    </span>
                                    <span class="kt-accordion-active:hidden inline-flex">
                                        <i class="ki-filled ki-plus text-muted-foreground text-sm">
                                        </i>
                                    </span>
                                    <span class="kt-accordion-active:inline-flex hidden">
                                        <i class="ki-filled ki-minus text-muted-foreground text-sm">
                                        </i>
                                    </span>
                                </button>
                                <div class="kt-accordion-content hidden" id="faq_2_content">
                                    <div class="text-secondary-foreground text-base pb-4">
                                        Metronic embraces flexible licensing options that empower you to choose
                                        the perfect fit for your project's needs and budget. Understanding the
                                        factors influencing each plan's pricing helps you make an informed
                                        decision
                                    </div>
                                </div>
                            </div>
                            <div class="kt-accordion-item not-last:border-b border-b-border" data-kt-accordion-item="true">
                                <button aria-controls="faq_3_content" class="kt-accordion-toggle py-4"
                                    data-kt-accordion-toggle="#faq_3_content">
                                    <span class="text-base text-mono">
                                        Are there any hidden fees in the pricing?
                                    </span>
                                    <span class="kt-accordion-active:hidden inline-flex">
                                        <i class="ki-filled ki-plus text-muted-foreground text-sm">
                                        </i>
                                    </span>
                                    <span class="kt-accordion-active:inline-flex hidden">
                                        <i class="ki-filled ki-minus text-muted-foreground text-sm">
                                        </i>
                                    </span>
                                </button>
                                <div class="kt-accordion-content hidden" id="faq_3_content">
                                    <div class="text-secondary-foreground text-base pb-4">
                                        Metronic embraces flexible licensing options that empower you to choose
                                        the perfect fit for your project's needs and budget. Understanding the
                                        factors influencing each plan's pricing helps you make an informed
                                        decision
                                    </div>
                                </div>
                            </div>
                            <div class="kt-accordion-item not-last:border-b border-b-border" data-kt-accordion-item="true">
                                <button aria-controls="faq_4_content" class="kt-accordion-toggle py-4"
                                    data-kt-accordion-toggle="#faq_4_content">
                                    <span class="text-base text-mono">
                                        Is there a discount for annual subscriptions?
                                    </span>
                                    <span class="kt-accordion-active:hidden inline-flex">
                                        <i class="ki-filled ki-plus text-muted-foreground text-sm">
                                        </i>
                                    </span>
                                    <span class="kt-accordion-active:inline-flex hidden">
                                        <i class="ki-filled ki-minus text-muted-foreground text-sm">
                                        </i>
                                    </span>
                                </button>
                                <div class="kt-accordion-content hidden" id="faq_4_content">
                                    <div class="text-secondary-foreground text-base pb-4">
                                        Metronic embraces flexible licensing options that empower you to choose
                                        the perfect fit for your project's needs and budget. Understanding the
                                        factors influencing each plan's pricing helps you make an informed
                                        decision
                                    </div>
                                </div>
                            </div>
                            <div class="kt-accordion-item not-last:border-b border-b-border" data-kt-accordion-item="true">
                                <button aria-controls="faq_5_content" class="kt-accordion-toggle py-4"
                                    data-kt-accordion-toggle="#faq_5_content">
                                    <span class="text-base text-mono">
                                        Do you offer refunds on subscription cancellations?
                                    </span>
                                    <span class="kt-accordion-active:hidden inline-flex">
                                        <i class="ki-filled ki-plus text-muted-foreground text-sm">
                                        </i>
                                    </span>
                                    <span class="kt-accordion-active:inline-flex hidden">
                                        <i class="ki-filled ki-minus text-muted-foreground text-sm">
                                        </i>
                                    </span>
                                </button>
                                <div class="kt-accordion-content hidden" id="faq_5_content">
                                    <div class="text-secondary-foreground text-base pb-4">
                                        Metronic embraces flexible licensing options that empower you to choose
                                        the perfect fit for your project's needs and budget. Understanding the
                                        factors influencing each plan's pricing helps you make an informed
                                        decision
                                    </div>
                                </div>
                            </div>
                            <div class="kt-accordion-item not-last:border-b border-b-border" data-kt-accordion-item="true">
                                <button aria-controls="faq_6_content" class="kt-accordion-toggle py-4"
                                    data-kt-accordion-toggle="#faq_6_content">
                                    <span class="text-base text-mono">
                                        Can I add extra features to my current plan?
                                    </span>
                                    <span class="kt-accordion-active:hidden inline-flex">
                                        <i class="ki-filled ki-plus text-muted-foreground text-sm">
                                        </i>
                                    </span>
                                    <span class="kt-accordion-active:inline-flex hidden">
                                        <i class="ki-filled ki-minus text-muted-foreground text-sm">
                                        </i>
                                    </span>
                                </button>
                                <div class="kt-accordion-content hidden" id="faq_6_content">
                                    <div class="text-secondary-foreground text-base pb-4">
                                        Metronic embraces flexible licensing options that empower you to choose
                                        the perfect fit for your project's needs and budget. Understanding the
                                        factors influencing each plan's pricing helps you make an informed
                                        decision
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div> --}}
                <div class="grid lg:grid-cols-2 gap-5 lg:gap-7.5">
                    {{-- TODO : REMOVE COMMENT LATER --}}
                    @include('partials/questions')
                </div>
            </div>
        </div>
        <!-- End of Container -->
    </main>
@endsection