/*
 * FİYATOMATİK
 * UI-A6.4-E6
 *
 * PROFESSIONAL CLEAN ICON SYSTEM
 *
 * Principles:
 * - text first
 * - icon never overlaps copy
 * - 10 unique icons
 * - no mascot / character block
 * - 2 x 5 desktop dashboard preserved
 */

.ft-e6-original-icon-hidden {
    display: none !important;
}

/*
 * Remove visual behavior inherited from E4/E5.
 */
.ft-engine-card.ft-e6-clean-card
.ft-e4-engine-visual,

.ft-engine-card.ft-e6-clean-card
.ft-e5-engine-visual {
    display: none !important;
}

/*
 * Keep cards clean and compact.
 */
.ft-engine-card.ft-e6-clean-card {
    position: relative !important;
    overflow: hidden !important;

    min-height: 194px !important;

    background:
        #ffffff !important;

    border:
        1px solid
        rgba(15,23,42,.075) !important;

    border-radius:
        20px !important;

    box-shadow:
        0 8px 25px
        rgba(15,23,42,.055) !important;
}

/*
 * Left identity area:
 *
 * [ICON] [TITLE / SUBTITLE / DESCRIPTION]
 *
 * Icon receives a dedicated 72px column.
 * Text can never run behind it.
 */
.ft-engine-card.ft-e6-clean-card
.ft-e1-engine-left {
    position: relative !important;

    display: grid !important;

    grid-template-columns:
        68px minmax(0,1fr) !important;

    grid-template-rows:
        auto auto 1fr !important;

    column-gap:
        18px !important;

    row-gap:
        4px !important;

    align-content:
        start !important;

    align-items:
        start !important;

    min-width:
        0 !important;

    padding:
        24px 22px 20px 22px !important;
}

/*
 * Unique icon container.
 */
.ft-engine-card.ft-e6-clean-card
.ft-e6-engine-icon {
    grid-column:
        1 !important;

    grid-row:
        1 / span 3 !important;

    align-self:
        start !important;

    display:
        flex !important;

    align-items:
        center !important;

    justify-content:
        center !important;

    width:
        64px !important;

    height:
        64px !important;

    min-width:
        64px !important;

    padding:
        9px !important;

    margin:
        0 !important;

    border-radius:
        18px !important;

    border:
        1px solid
        rgba(15,23,42,.055) !important;

    background:
        #f8fafc !important;

    box-shadow:
        0 7px 18px
        rgba(15,23,42,.06) !important;
}

.ft-engine-card.ft-e6-clean-card
.ft-e6-engine-icon img {
    display:
        block !important;

    width:
        46px !important;

    height:
        46px !important;

    max-width:
        46px !important;

    max-height:
        46px !important;

    margin:
        0 !important;

    padding:
        0 !important;

    object-fit:
        contain !important;
}

/*
 * Motor name.
 */
.ft-engine-card.ft-e6-clean-card
.ft-e1-engine-left > strong {
    grid-column:
        2 !important;

    grid-row:
        1 !important;

    display:
        block !important;

    position:
        static !important;

    margin:
        0 !important;

    padding:
        0 !important;

    font-size:
        20px !important;

    line-height:
        1.12 !important;

    font-weight:
        800 !important;

    letter-spacing:
        -.025em !important;

    color:
        #111827 !important;
}

/*
 * Motor subtitle.
 */
.ft-engine-card.ft-e6-clean-card
.ft-e1-engine-left > small {
    grid-column:
        2 !important;

    grid-row:
        2 !important;

    display:
        block !important;

    position:
        static !important;

    margin:
        1px 0 0 0 !important;

    padding:
        0 !important;

    font-size:
        13px !important;

    line-height:
        1.3 !important;

    font-weight:
        750 !important;
}

/*
 * Description.
 */
.ft-engine-card.ft-e6-clean-card
.ft-e1-engine-left > p {
    grid-column:
        2 !important;

    grid-row:
        3 !important;

    display:
        block !important;

    position:
        static !important;

    margin:
        7px 0 0 0 !important;

    padding:
        0 !important;

    max-width:
        310px !important;

    font-size:
        13px !important;

    line-height:
        1.5 !important;

    font-weight:
        450 !important;

    color:
        #667085 !important;
}

/*
 * Feed / current summary area.
 * Preserve content; improve whitespace.
 */
.ft-engine-card.ft-e6-clean-card
.ft-e1-engine-feed {
    min-width:
        0 !important;

    padding:
        22px 24px 18px 24px !important;

    border-left:
        1px solid
        rgba(15,23,42,.075) !important;

    background:
        rgba(248,250,252,.36) !important;
}

.ft-engine-card.ft-e6-clean-card
.ft-e1-engine-feed strong {
    font-size:
        12px !important;

    line-height:
        1.2 !important;

    font-weight:
        850 !important;

    letter-spacing:
        .015em !important;
}

/*
 * Keep feed rows calm and readable.
 */
.ft-engine-card.ft-e6-clean-card
.ft-e1-engine-feed li {
    font-size:
        12.5px !important;

    line-height:
        1.42 !important;

    color:
        #667085 !important;
}

/*
 * Bottom status/actions remain visually separated.
 */
.ft-engine-card.ft-e6-clean-card
.ft-engine-status {
    font-size:
        12px !important;
}

/*
 * Per-engine icon background.
 * Every icon is unique AND color-coded.
 */

.ft-engine-card[data-engine="katip"]
.ft-e6-engine-icon {
    background:
        #ecfeff !important;
}

.ft-engine-card[data-engine="oduncu"]
.ft-e6-engine-icon {
    background:
        #fff7ed !important;
}

.ft-engine-card[data-engine="kasif"]
.ft-e6-engine-icon {
    background:
        #f5f3ff !important;
}

.ft-engine-card[data-engine="tazi"]
.ft-e6-engine-icon {
    background:
        #ecfdf5 !important;
}

.ft-engine-card[data-engine="tilki"]
.ft-e6-engine-icon {
    background:
        #fff1f2 !important;
}

.ft-engine-card[data-engine="altin-rehber"]
.ft-e6-engine-icon {
    background:
        #fffbeb !important;
}

.ft-engine-card[data-engine="aslan"]
.ft-e6-engine-icon {
    background:
        #fff7ed !important;
}

.ft-engine-card[data-engine="oyuncu"]
.ft-e6-engine-icon {
    background:
        #f5f3ff !important;
}

.ft-engine-card[data-engine="bilge"]
.ft-e6-engine-icon {
    background:
        #fdf4ff !important;
}

.ft-engine-card[data-engine="dedektif"]
.ft-e6-engine-icon {
    background:
        #f0fdfa !important;
}

/*
 * Do not let legacy pseudo-elements invade text.
 */
.ft-engine-card.ft-e6-clean-card
.ft-e1-engine-left::before,

.ft-engine-card.ft-e6-clean-card
.ft-e1-engine-left::after,

.ft-engine-card.ft-e6-clean-card
.ft-e6-engine-icon::before,

.ft-engine-card.ft-e6-clean-card
.ft-e6-engine-icon::after {
    content:
        none !important;

    display:
        none !important;
}

/*
 * Desktop two-column layout remains authoritative.
 */
@media (min-width: 981px) {

    .ft-engine-grid {
        display:
            grid !important;

        grid-template-columns:
            repeat(2,minmax(0,1fr)) !important;

        gap:
            16px !important;

        align-items:
            stretch !important;
    }

    .ft-engine-card.ft-e6-clean-card {
        width:
            auto !important;

        max-width:
            none !important;

        margin:
            0 !important;
    }
}

/*
 * Tablet/mobile safety.
 */
@media (max-width: 980px) {

    .ft-engine-grid {
        grid-template-columns:
            1fr !important;
    }
}

@media (max-width: 640px) {

    .ft-engine-card.ft-e6-clean-card
    .ft-e1-engine-left {
        grid-template-columns:
            54px minmax(0,1fr) !important;

        column-gap:
            13px !important;

        padding:
            18px !important;
    }

    .ft-engine-card.ft-e6-clean-card
    .ft-e6-engine-icon {
        width:
            50px !important;

        height:
            50px !important;

        min-width:
            50px !important;

        border-radius:
            14px !important;

        padding:
            7px !important;
    }

    .ft-engine-card.ft-e6-clean-card
    .ft-e6-engine-icon img {
        width:
            36px !important;

        height:
            36px !important;

        max-width:
            36px !important;

        max-height:
            36px !important;
    }

    .ft-engine-card.ft-e6-clean-card
    .ft-e1-engine-left > strong {
        font-size:
            18px !important;
    }
}