mixin CardProductShare
  .card&attributes(attributes)
    .card-header.pb-0
      h6.mb-0.mt-2.d-flex.align-items-center Product Share
    .card-body.d-flex.flex-column.justify-content-end
      .row.align-items-end
        .col
          p.font-sans-serif.lh-1.mb-1.fs-7 34.6%
          span.badge.badge-subtle-success.rounded-pill
            span.fas.fa-caret-up.me-1
            | 3.5%
        .col-auto.ps-0
          div
            canvas#marketShareDoughnut.my-n5(width=112 height=112)
          p.mb-0.text-center.fs-11.mt-4.text-500 Target: 
            span.text-800 55%

mixin CardTotalOrderEcommerce
  .card&attributes(attributes)
    .card-header.pb-0
      h6.mb-0.mt-2.d-flex.align-items-center Total Order
    .card-body
      .row.align-items-end
        .col
          p.font-sans-serif.lh-1.mb-1.fs-7 58.4K
          .badge.badge-subtle-primary.rounded-pill.fs-11
            span.fas.fa-caret-up.me-1
            | 13.6%
        .col-auto.ps-0
           .total-order-ecommerce(data-echarts!={
              series: [
                { 
                  type: 'line',
                  data: [110, 100, 250, 210, 530, 480, 320,325],
                }
              ],
              grid: { bottom: "-10px" },
            })