/* =========================================================
   MOHAJI TECH ICON SYSTEM
   SVG files use common:
   viewBox="250 250 595 595"
   ========================================================= */

:root {
    --mohaji-tech-icon-header: 24px;
    --mohaji-tech-icon-action: 28px;
}


/* =========================================================
   1. COMMON RESET
   ========================================================= */

.navigation-buttons .icon-search,
.navigation-buttons .icon-login,
.navigation-buttons .icon-cart,

.link-icons .icon-print,
.link-icons .icon-comment,
.link-icons .icon-watchdog,
.link-icons .icon-share {
    display: inline-block !important;
    position: relative !important;

    font-size: 0 !important;
    line-height: 1 !important;

    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: contain !important;

    vertical-align: middle;
}


/* Remove original Shoptet icon-font glyphs */

.navigation-buttons .icon-search::before,
.navigation-buttons .icon-search::after,

.navigation-buttons .icon-login::before,
.navigation-buttons .icon-login::after,

.navigation-buttons .icon-cart::before,
.navigation-buttons .icon-cart::after,

.link-icons .icon-print::before,
.link-icons .icon-print::after,

.link-icons .icon-comment::before,
.link-icons .icon-comment::after,

.link-icons .icon-watchdog::before,
.link-icons .icon-watchdog::after,

.link-icons .icon-share::before,
.link-icons .icon-share::after {
    content: none !important;
    display: none !important;
}


/* =========================================================
   2. HEADER ICONS
   ========================================================= */

.navigation-buttons .icon-search,
.navigation-buttons .icon-login,
.navigation-buttons .icon-cart {
    width: var(--mohaji-tech-icon-header) !important;
    height: var(--mohaji-tech-icon-header) !important;
}


/* Search */

.navigation-buttons .icon-search {
    background-image:
        url("https://www.mohaji.cz/user/documents/upload/mohaji-tech-icons/tech-search.svg") !important;
}


/* User / Login */

.navigation-buttons .icon-login {
    background-image:
        url("https://www.mohaji.cz/user/documents/upload/mohaji-tech-icons/tech-user.svg") !important;
}


/* Header cart */

.navigation-buttons .icon-cart {
    background-image:
        url("https://www.mohaji.cz/user/documents/upload/mohaji-tech-icons/tech-cart.svg") !important;
}


/* =========================================================
   3. PRODUCT DETAIL ACTION ICONS
   ========================================================= */

.link-icons .icon-print,
.link-icons .icon-comment,
.link-icons .icon-watchdog,
.link-icons .icon-share {
    width: var(--mohaji-tech-icon-action) !important;
    height: var(--mohaji-tech-icon-action) !important;
}


/* Print */

.link-icons .icon-print {
    background-image:
        url("https://www.mohaji.cz/user/documents/upload/mohaji-tech-icons/tech-print.svg") !important;
}


/* Ask / Chat */

.link-icons .icon-comment {
    background-image:
        url("https://www.mohaji.cz/user/documents/upload/mohaji-tech-icons/tech-chat.svg") !important;
}


/* Watchdog / Hlídat cenu */

.link-icons .icon-watchdog {
    background-image:
        url("https://www.mohaji.cz/user/documents/upload/mohaji-tech-icons/tech-amplify.svg") !important;
}


/* Share */

.link-icons .icon-share {
    background-image:
        url("https://www.mohaji.cz/user/documents/upload/mohaji-tech-icons/tech-share.svg") !important;
}

/* =========================================================
   PRODUCT DETAIL ACTIONS – ALIGN FIX
   ========================================================= */

.link-icons {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 18px;
}

.link-icons .link-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px;

    vertical-align: middle;
    line-height: 1.2;
    text-align: left;
    white-space: nowrap;
}

.link-icons .link-icon i,
.link-icons .link-icon span[class^="icon-"] {
    flex: 0 0 auto;
    display: inline-block !important;
    vertical-align: middle;
}

.link-icons .link-icon > span:not([class^="icon-"]) {
    display: inline-block;
    vertical-align: middle;
    line-height: 1.2;
}

.link-icons .link-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px;

    min-height: 56px;

    line-height: 1 !important;
}

.link-icons .link-icon > i,
.link-icons .link-icon > span[class^="icon-"] {
    display: block !important;
    flex: 0 0 auto;

    width: 28px !important;
    height: 28px !important;

    margin: 0 !important;
    padding: 0 !important;

    line-height: 0 !important;
    font-size: 0 !important;

    align-self: center !important;
}

.link-icons .link-icon > span:not([class^="icon-"]) {
    display: block !important;

    margin: 0 !important;
    padding: 0 !important;

    line-height: 1 !important;
}
