{{-- Mixed Widget 1 --}}
<div class="card card-custom bg-white {{ @$class }} border-10 ff-montserrat shadow">
    {{-- Body --}}
    <div class="card-body d-flex align-items-center p-6">
        <div class="d-flex align-items-center justify-content-between flex-grow-1">
            <span class="symbol symbol-50 mr-4">
                <span class="symbol-label border-10" style="background-color: #E0ECFF">
                    <span class="svg-icon svg-icon-xl svg-icon-info">
                        <!--begin::Svg Icon | path:/metronic/theme/html/demo1/dist/assets/media/svg/icons/Shopping/Cart3.svg-->
                        <svg xmlns="http://www.w3.org/2000/svg" width="23.222" height="28" viewBox="0 0 23.222 28">
                            <path id="Caminho_337" data-name="Caminho 337" d="M62.25,245.666a7.792,7.792,0,0,0-.023-.808,2.471,2.471,0,0,0-1.607-2.114,2.539,2.539,0,0,0-.829-.153c-.063,0-.125,0-.19,0s-.121,0-.181,0c-.8-.009-1.61,0-2.416,0-.151,0-.3-.021-.483-.037a2.056,2.056,0,0,0-1.366-2.316H46.194l-.035.014a2.057,2.057,0,0,0-1.329,2.3c-.2.014-.365.039-.53.039-.785,0-1.573-.007-2.358,0l-.181,0c-.086,0-.172,0-.258,0a2.533,2.533,0,0,0-1.343.406l-.063.042a2.111,2.111,0,0,0-.785.92l-.035.072c-.009.026-.021.053-.033.081a2.6,2.6,0,0,0-.188.746l-.007.091c-.021.237-.019.476-.019.718q0,7.578,0,15.161v4.23a5.329,5.329,0,0,0,.158,1.491c.239.79.78,1.21,1.9,1.682H60.2c1.069-.451,1.61-.857,1.861-1.584a4.915,4.915,0,0,0,.19-1.589v-4.825Q62.252,252.947,62.25,245.666Zm-15.015-3.071H54.08v2.267H47.234Zm12.725,22.711c0,.467-.153.6-.63.595-2.472-.014-4.943-.012-7.415-.012h-2.5c-2.486,0-4.969,0-7.454.012-.49,0-.634-.135-.632-.632v-.007q.01-4.035.012-8.072,0-5.85-.009-11.7a1.46,1.46,0,0,1,.016-.237v0a.387.387,0,0,1,.358-.374h.767a.056.056,0,0,1,.028,0c.592,0,1.189,0,1.8,0h.513c.007.056.012.111.014.163a4.831,4.831,0,0,0,.007.527,1.766,1.766,0,0,0,.876,1.415c.037.021.074.042.111.058a1.155,1.155,0,0,0,.111.049c.051.021.1.037.156.053a1.307,1.307,0,0,0,.165.037c.056.012.114.019.172.026s.116.007.177.007q4.056.014,8.116,0h.019a1.747,1.747,0,0,0,1.775-1.645c.019-.2,0-.409,0-.69h.476c.611,0,1.208.007,1.8,0a.066.066,0,0,1,.03,0h.755c.3.046.376.246.376.616q-.007,4.537-.009,9.071v2.585q0,.878,0,1.754,0,1.439,0,2.873,0,1.749.007,3.5Z" transform="translate(-39.03 -240.23)" fill="#4791ff"/>
                            <path id="Caminho_338" data-name="Caminho 338" d="M68.3,301.85a1.261,1.261,0,0,1-1.375,1.335c-.668.005-1.333.008-2,.008-1.461.005-2.922,0-4.38-.008a1.285,1.285,0,0,1-1.4-1.317,1.222,1.222,0,0,1,.99-1.2,1.9,1.9,0,0,1,.4-.047c1.076-.013,2.152-.005,3.226-.005,1.053,0,2.1-.008,3.155,0C67.779,300.628,68.277,301.081,68.3,301.85Z" transform="translate(-54.787 -286.743)" fill="#4791ff"/>
                            <path id="Caminho_339" data-name="Caminho 339" d="M97.087,281.694c.008.817-.518,1.3-1.464,1.322-.817.016-1.634,0-2.451,0s-1.634.013-2.453,0a1.322,1.322,0,1,1,.034-2.618q2.415-.016,4.833,0C96.519,280.4,97.077,280.9,97.087,281.694Z" transform="translate(-78.205 -271.169)" fill="#4791ff"/>
                            <path id="Caminho_340" data-name="Caminho 340" d="M62.022,321.9a1.32,1.32,0,0,1-1.354,1.283q-.082.008-.165.008c-.817.008-1.636,0-2.451,0s-1.636.01-2.453,0a1.275,1.275,0,0,1-1.43-1.286,1.3,1.3,0,0,1,1.464-1.33q2.172-.016,4.346,0l.558,0A1.342,1.342,0,0,1,62.022,321.9Z" transform="translate(-50.845 -302.123)" fill="#4791ff"/>
                            <path id="Caminho_341" data-name="Caminho 341" d="M64.352,281.649a1.24,1.24,0,0,1-1.233,1.333c-.175.013-.348.018-.524.018-.115,0-.23,0-.346-.005l-.076,0-.27,0c-.029,0-.06,0-.092,0h-.094l-.2,0c-.1,0-.2,0-.306.005-.189.005-.374.005-.563,0-.084,0-.17-.008-.257-.013a1.286,1.286,0,0,1-1.249-1.333,1.268,1.268,0,0,1,1.246-1.265c.909-.042,1.822-.039,2.731,0A1.251,1.251,0,0,1,64.352,281.649Z" transform="translate(-54.615 -271.142)" fill="#4791ff"/>
                        </svg>
                        <!--end::Svg Icon-->
                    </span>
                </span>
            </span>
            <div class="d-flex flex-column text-left flex-fill font-size-h6">
                <small class="font-weight-normal text-muted">Ligações Atendidas</small>
                <span class="font-weight-bold text-dark-75 font-size-h3" id="countCalls">
                    <div class="spinner py-4"></div>
                </span>
            </div>
        </div>
    </div>
</div>