/* ==========================================================================
   Ikony – SVG ako CSS mask, farba = background-color (currentColor)
   Použitie: <span class="icon icon--team" aria-hidden="true"></span>
   ========================================================================== */

.icon {
    display: inline-block;
    flex: none;
    width: var(--icon-size, 20px);
    height: var(--icon-size, 20px);
    background-color: currentColor;
    -webkit-mask: var(--icon) center / contain no-repeat;
    mask: var(--icon) center / contain no-repeat;
}

.icon--accountant { --icon: url("../../icons/accountant-Qv8cTAQ.svg"); }
.icon--agenda { --icon: url("../../icons/agenda-JAHoHNR.svg"); }
.icon--briefcase { --icon: url("../../icons/briefcase-aYeUk50.svg"); }
.icon--directions { --icon: url("../../icons/directions-lFOPaEd.svg"); }
.icon--focus { --icon: url("../../icons/focus-65aG7YQ.svg"); }
.icon--gear { --icon: url("../../icons/gear-QFwf1QW.svg"); }
.icon--network { --icon: url("../../icons/network-OM6HZpA.svg"); }
.icon--office { --icon: url("../../icons/office-P72Rvst.svg"); }
.icon--research { --icon: url("../../icons/research-Fd_sPo0.svg"); }
.icon--speedometer { --icon: url("../../icons/speedometer-i-L490J.svg"); }
.icon--team { --icon: url("../../icons/team-lz14CfX.svg"); }
.icon--time { --icon: url("../../icons/time--l7wz2K.svg"); }

/* Štvorec s prechodom a bielou ikonou (badge) */
.icon-badge {
    display: inline-flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: var(--badge-size, 44px);
    height: var(--badge-size, 44px);
    border-radius: var(--badge-radius, 12px);
    background: var(--badge-bg, var(--gradient-step-1));
    box-shadow: var(--shadow-badge);
    color: #fff;
}

.icon-badge--1 { --badge-bg: var(--gradient-step-1); }
.icon-badge--2 { --badge-bg: var(--gradient-step-2); }
.icon-badge--3 { --badge-bg: var(--gradient-step-3); }
.icon-badge--4 { --badge-bg: var(--gradient-step-4); }