/* =============================================================
   ikony.css — SVG ikony přes CSS mask-image
   Barva ikony = text color (color: #030333 / color: #87AC3D …)
   Použití:  <span class="ikona ikona--vyroba-a"></span>
             <span class="ikona ikona--lg ikona--sklady" style="color:#87AC3D"></span>
   ============================================================= */

/* --- Základní třída ----------------------------------------- */
.ikona {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-color: currentColor;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-size: contain;
            mask-size: contain;
    -webkit-mask-position: center;
            mask-position: center;
    flex-shrink: 0;
    vertical-align: middle;
}

/* --- Velikostní varianty ------------------------------------ */
.ikona--sm  { width: 16px; height: 16px; }
.ikona--md  { width: 24px; height: 24px; } /* výchozí */
.ikona--lg  { width: 32px; height: 32px; }
.ikona--xl  { width: 48px; height: 48px; }
.ikona--2xl { width: 64px; height: 64px; }


/* =============================================================
   OBLASTI IS KARAT
   ============================================================= */

.ikona--vyroba-a {
    -webkit-mask-image: url('images/ikony/oblast-vyroba-a.svg');
            mask-image: url('images/ikony/oblast-vyroba-a.svg');
}
.ikona--vyroba-b {
    -webkit-mask-image: url('images/ikony/oblast-vyroba-b.svg');
            mask-image: url('images/ikony/oblast-vyroba-b.svg');
}
.ikona--sklady {
    -webkit-mask-image: url('images/ikony/oblast-sklady.svg');
            mask-image: url('images/ikony/oblast-sklady.svg');
}
.ikona--obchod {
    -webkit-mask-image: url('images/ikony/oblast-obchod.svg');
            mask-image: url('images/ikony/oblast-obchod.svg');
}
.ikona--ekonomika {
    -webkit-mask-image: url('images/ikony/oblast-ekonomika.svg');
            mask-image: url('images/ikony/oblast-ekonomika.svg');
}
.ikona--pam {
    -webkit-mask-image: url('images/ikony/oblast-pam.svg');
            mask-image: url('images/ikony/oblast-pam.svg');
}
.ikona--workflow-a {
    -webkit-mask-image: url('images/ikony/oblast-workflow-a.svg');
            mask-image: url('images/ikony/oblast-workflow-a.svg');
}
.ikona--workflow-b {
    -webkit-mask-image: url('images/ikony/oblast-workflow-b.svg');
            mask-image: url('images/ikony/oblast-workflow-b.svg');
}
.ikona--projekty-a {
    -webkit-mask-image: url('images/ikony/oblast-projekty-a.svg');
            mask-image: url('images/ikony/oblast-projekty-a.svg');
}
.ikona--projekty-b {
    -webkit-mask-image: url('images/ikony/oblast-projekty-b.svg');
            mask-image: url('images/ikony/oblast-projekty-b.svg');
}
.ikona--servis {
    -webkit-mask-image: url('images/ikony/oblast-servis.svg');
            mask-image: url('images/ikony/oblast-servis.svg');
}
.ikona--management {
    -webkit-mask-image: url('images/ikony/oblast-management.svg');
            mask-image: url('images/ikony/oblast-management.svg');
}
.ikona--mobilni {
    -webkit-mask-image: url('images/ikony/oblast-mobilni.svg');
            mask-image: url('images/ikony/oblast-mobilni.svg');
}
.ikona--doprava-a {
    -webkit-mask-image: url('images/ikony/oblast-doprava-a.svg');
            mask-image: url('images/ikony/oblast-doprava-a.svg');
}
.ikona--doprava-b {
    -webkit-mask-image: url('images/ikony/oblast-doprava-b.svg');
            mask-image: url('images/ikony/oblast-doprava-b.svg');
}
.ikona--api-a {
    -webkit-mask-image: url('images/ikony/oblast-api-a.svg');
            mask-image: url('images/ikony/oblast-api-a.svg');
}
.ikona--api-b {
    -webkit-mask-image: url('images/ikony/oblast-api-b.svg');
            mask-image: url('images/ikony/oblast-api-b.svg');
}
.ikona--vyvoj-a {
    -webkit-mask-image: url('images/ikony/oblast-vyvoj-a.svg');
            mask-image: url('images/ikony/oblast-vyvoj-a.svg');
}
.ikona--vyvoj-b {
    -webkit-mask-image: url('images/ikony/oblast-vyvoj-b.svg');
            mask-image: url('images/ikony/oblast-vyvoj-b.svg');
}


/* =============================================================
   NAVIGACE / FIREMNÍ SEKCE
   ============================================================= */

.ikona--erp-a {
    -webkit-mask-image: url('images/ikony/nav-erp-a.svg');
            mask-image: url('images/ikony/nav-erp-a.svg');
}
.ikona--erp-b {
    -webkit-mask-image: url('images/ikony/nav-erp-b.svg');
            mask-image: url('images/ikony/nav-erp-b.svg');
}
.ikona--implementace-a {
    -webkit-mask-image: url('images/ikony/nav-implementace-a.svg');
            mask-image: url('images/ikony/nav-implementace-a.svg');
}
.ikona--implementace-b {
    -webkit-mask-image: url('images/ikony/nav-implementace-b.svg');
            mask-image: url('images/ikony/nav-implementace-b.svg');
}
.ikona--reference-a {
    -webkit-mask-image: url('images/ikony/nav-reference-a.svg');
            mask-image: url('images/ikony/nav-reference-a.svg');
}
.ikona--reference-b {
    -webkit-mask-image: url('images/ikony/nav-reference-b.svg');
            mask-image: url('images/ikony/nav-reference-b.svg');
}
.ikona--kariera-a {
    -webkit-mask-image: url('images/ikony/nav-kariera-a.svg');
            mask-image: url('images/ikony/nav-kariera-a.svg');
}
.ikona--kariera-b {
    -webkit-mask-image: url('images/ikony/nav-kariera-b.svg');
            mask-image: url('images/ikony/nav-kariera-b.svg');
}
.ikona--servis-podpora-a {
    -webkit-mask-image: url('images/ikony/servis-podpora-a.svg');
            mask-image: url('images/ikony/servis-podpora-a.svg');
}
.ikona--servis-podpora-b {
    -webkit-mask-image: url('images/ikony/servis-podpora-b.svg');
            mask-image: url('images/ikony/servis-podpora-b.svg');
}


/* =============================================================
   OSTATNÍ / NAVRHOVANÉ OBLASTI
   ============================================================= */

.ikona--nakup {
    -webkit-mask-image: url('images/ikony/nakup.svg');
            mask-image: url('images/ikony/nakup.svg');
}

/* Pokladna — POS register / paragonová pokladna v IS KARAT */
.ikona--pokladna {
    -webkit-mask-image: url('images/ikony/pokladna.svg');
            mask-image: url('images/ikony/pokladna.svg');
}

/* Katalog / sortiment — kniha s mřížkou pro správu rozsáhlého katalogu */
.ikona--katalog {
    -webkit-mask-image: url('images/ikony/katalog.svg');
            mask-image: url('images/ikony/katalog.svg');
}

/* Loyalty / dárkové poukazy / benefit program */
.ikona--loyalty {
    -webkit-mask-image: url('images/ikony/loyalty.svg');
            mask-image: url('images/ikony/loyalty.svg');
}

/* Analytika / obraty / obrátkovost zásob — sloupcový graf s trendem */
.ikona--analytika {
    -webkit-mask-image: url('images/ikony/analytika.svg');
            mask-image: url('images/ikony/analytika.svg');
}

/* Webové služby / API — cloud s lomenými závorkami (web + code) */
.ikona--webove-sluzby {
    -webkit-mask-image: url('images/ikony/webove-sluzby.svg');
            mask-image: url('images/ikony/webove-sluzby.svg');
}

/* DMS — správa dokumentů (vrstvené dokumenty) */
.ikona--dms {
    -webkit-mask-image: url('images/ikony/dms.svg');
            mask-image: url('images/ikony/dms.svg');
}

/* TPV / změnové řízení — výkres s razítkem */
.ikona--tpv {
    -webkit-mask-image: url('images/ikony/tpv.svg');
            mask-image: url('images/ikony/tpv.svg');
}

/* Gantt — vodorovné pruhy úloh v časové ose (plánování výroby APS) */
.ikona--gantt {
    -webkit-mask-image: url('images/ikony/gantt.svg');
            mask-image: url('images/ikony/gantt.svg');
}


/* =============================================================
   MEDIÁLNÍ ZDROJE — video, PDF, externí odkaz, článek
   (pro sekce Materiály a zdroje u referencí)
   ============================================================= */

.ikona--media-video {
    -webkit-mask-image: url('images/ikony/media-video.svg');
            mask-image: url('images/ikony/media-video.svg');
}
.ikona--media-pdf {
    -webkit-mask-image: url('images/ikony/media-pdf.svg');
            mask-image: url('images/ikony/media-pdf.svg');
}
.ikona--media-externi {
    -webkit-mask-image: url('images/ikony/media-externi.svg');
            mask-image: url('images/ikony/media-externi.svg');
}
.ikona--media-clanek {
    -webkit-mask-image: url('images/ikony/media-clanek.svg');
            mask-image: url('images/ikony/media-clanek.svg');
}


/* =============================================================
   KARATSOFTWARE.CZ — ikony pro křížové propojení s KSW
   (reference zákazníků, případové studie, rozhovory)
   ============================================================= */

.ikona--ksw-reference {
    -webkit-mask-image: url('images/ikony/ksw-reference.svg');
            mask-image: url('images/ikony/ksw-reference.svg');
}
.ikona--ksw-studie {
    -webkit-mask-image: url('images/ikony/ksw-studie.svg');
            mask-image: url('images/ikony/ksw-studie.svg');
}
.ikona--ksw-rozhovor {
    -webkit-mask-image: url('images/ikony/ksw-rozhovor.svg');
            mask-image: url('images/ikony/ksw-rozhovor.svg');
}


/* =============================================================
   POMOCNÉ BAREVNÉ MODIFIKÁTORY
   (alternativa k inline style="color:…")
   ============================================================= */

.ikona--modra  { color: #030333; }
.ikona--zelena { color: #87AC3D; }
.ikona--bila   { color: #ffffff; }
.ikona--seda   { color: #888888; }