[data-finkit-widget] .widget-card {
  
    container-type: inline-size;
    width: 100%;
    height:100%;
}


[data-finkit-widget] .card-body {
    padding: .875rem 1rem;
    min-height: 86px;
}

[data-finkit-widget] .widget-label,
[data-finkit-widget] .widget-value {
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


[data-finkit-widget] .widget-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    
}

    [data-finkit-widget] .widget-avatar img {
        width: 60%;
        height: auto;
        display: block;
    }

    [data-finkit-widget] .widget-avatar i {
        line-height: 1;
    }


@supports (width: 1cqi) {
    [data-finkit-widget] .widget-card {
   
        --wg-avatar: clamp(36px, 9cqi, 56px);
        --wg-icon: clamp(16px, 3cqi, 22px);
    
        --wg-label: clamp(18px, 4.2cqi, 28px);
        --wg-value: clamp(14px, 3.0cqi, 20px);
    }
}

@supports not (width: 1cqi) {
    [data-finkit-widget] .widget-card {
        --wg-avatar: clamp(36px, 2vw + 24px, 56px);
        --wg-icon: clamp(16px, .7vw + 12px, 22px);
     
        --wg-label: clamp(18px, 1.4vw + 14px, 28px);
        --wg-value: clamp(14px, 0.9vw + 12px, 20px);
    }
}


[data-finkit-widget] .widget-avatar {
    width: var(--wg-avatar);
    height: var(--wg-avatar);
}

    [data-finkit-widget] .widget-avatar i {
        font-size: var(--wg-icon);
    }

[data-finkit-widget] .widget-label {
    font-size: var(--wg-label);
    font-weight: 400;
}

[data-finkit-widget] .widget-value {
    font-size: var(--wg-value);
    font-weight: 300;
}


[data-finkit-widget] .card-body .flex-fill {
    min-width: 0;
}

[data-finkit-widget] .widget-value.fs-24 {
    font-size: 1.5rem;
}

[data-finkit-widget] .widget-value.fs-18 {
    font-size: 1.125rem;
}

.placeholder-glow [data-finkit-widget] .widget-avatar i,
.placeholder-glow [data-finkit-widget] .widget-avatar img {
    display: none !important;
}

.placeholder-glow [data-finkit-widget] .widget-value.placeholder {
    display: inline-block !important;
    opacity: .3 !important;
}

.placeholder-glow [data-finkit-widget] .widget-label.placeholder {
    display: none !important;
    opacity: .3 !important;
}

.widget-row-compact [data-finkit-widget] .card-body {
    padding: 1.25rem 1.5rem;
    min-height: auto;
}

.widget-row-compact [data-finkit-widget] .card {
    margin-bottom: 0;
}