/* Counters + — i2t3 component styles
 * Richer counter row (vs. the Bootstrap "counters"): style variants, a columns
 * selector and an optional prefix per value. The count-up animation reuses the
 * shared counters script (.i2t3-counters-section .counter-number), so no own JS.
 */

.i2t3-counters-plus__item { padding: 1.25rem; height: 100%; }
.i2t3-counters-plus__prefix { font-weight: 600; }

/* Size scale (ported from Karma _counters.scss: icon / value / label).
 * Default: icon 35px, value 50px, label 20px.
 * Small (counters-sm): 25 / 35 / 15px. Large (counters-lg): 45 / 60 / 25px.
 */
.i2t3-counters-plus__icon i { font-size: 35px; line-height: 35px; }
.i2t3-counters-plus__value {
    font-weight: 700;
    font-size: 50px;
    line-height: 50px;
}
.i2t3-counters-plus__item .h6 { font-size: 20px; line-height: 20px; }

.i2t3-counters-plus--counters-sm .i2t3-counters-plus__icon i { font-size: 25px; line-height: 25px; }
.i2t3-counters-plus--counters-sm .i2t3-counters-plus__value { font-size: 35px; line-height: 35px; }
.i2t3-counters-plus--counters-sm .i2t3-counters-plus__item .h6 { font-size: 15px; line-height: 15px; }

.i2t3-counters-plus--counters-lg .i2t3-counters-plus__icon i { font-size: 45px; line-height: 45px; }
.i2t3-counters-plus--counters-lg .i2t3-counters-plus__value { font-size: 60px; line-height: 60px; }
.i2t3-counters-plus--counters-lg .i2t3-counters-plus__item .h6 { font-size: 25px; line-height: 25px; }

.i2t3-counters-plus--boxed .i2t3-counters-plus__item {
    background: var(--i2t3-surface, #fff);
    border-radius: .75rem;
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .08);
}
.i2t3-counters-plus--bordered .i2t3-counters-plus__item {
    border: 1px solid var(--i2t3-border-color, #dee2e6);
    border-radius: .75rem;
}
/* Square corners for the bordered style (when "Rounded corners" is off). */
.i2t3-counters-plus--bordered.i2t3-counters-plus--sharp .i2t3-counters-plus__item {
    border-radius: 0;
}
