/*
 * FİYATOMATİK F19.1
 * Strong arrow / premium glass micro patch
 */


/* =========================================================
   MOTOR GİRİŞ DÜĞMESİ
   ========================================================= */

html body .ft-engine-card[data-engine]
.ft-engine-foot > span:last-child,

html body .ft-engine-card[data-engine]
.ft-engine-foot > a:last-child,

html body .ft-engine-card[data-engine]
.ft-e1-engine-left > .ft-engine-foot > :last-child {

    width: 48px !important;
    min-width: 48px !important;

    height: 48px !important;
    min-height: 48px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 0 0 2px 0 !important;

    border-radius: 50% !important;

    border:
        2px solid rgba(255,255,255,.86) !important;

    /*
     * Engine's original background color remains.
     * These effects create the glass depth.
     */
    box-shadow:
        0 11px 24px rgba(15,23,42,.19),
        0 4px 9px rgba(15,23,42,.12),
        inset 0 2px 2px rgba(255,255,255,.78),
        inset 0 -2px 3px rgba(15,23,42,.13) !important;

    backdrop-filter:
        blur(14px)
        saturate(165%)
        brightness(1.04) !important;

    -webkit-backdrop-filter:
        blur(14px)
        saturate(165%)
        brightness(1.04) !important;

    /*
     * THIS IS THE IMPORTANT PART:
     * make the actual arrow visually strong.
     */
    font-family:
        Arial,
        "Helvetica Neue",
        sans-serif !important;

    font-size: 25px !important;
    font-weight: 900 !important;

    line-height: 1 !important;

    letter-spacing: -2px !important;

    text-shadow:
        0 1px 1px rgba(255,255,255,.45),
        0 1px 3px rgba(15,23,42,.18) !important;

    opacity: 1 !important;

    transition:
        transform .17s ease,
        box-shadow .17s ease,
        filter .17s ease !important;
}


/* Make nested arrow glyph strong too, if present. */

html body .ft-engine-card[data-engine]
.ft-engine-foot > :last-child > span,

html body .ft-engine-card[data-engine]
.ft-engine-foot > :last-child > i,

html body .ft-engine-card[data-engine]
.ft-engine-foot > :last-child > svg {

    font-size: 25px !important;
    font-weight: 900 !important;

    opacity: 1 !important;

    stroke-width: 3 !important;
}


/* SVG arrows specifically */

html body .ft-engine-card[data-engine]
.ft-engine-foot > :last-child svg {

    width: 23px !important;
    height: 23px !important;

    stroke: currentColor !important;
}


/* Premium hover */

html body .ft-engine-card[data-engine]
.ft-engine-foot > :last-child:hover {

    transform:
        translateY(-3px)
        scale(1.09) !important;

    filter:
        brightness(1.10)
        saturate(1.12) !important;

    box-shadow:
        0 16px 30px rgba(15,23,42,.23),
        0 6px 13px rgba(15,23,42,.14),
        inset 0 2px 2px rgba(255,255,255,.90),
        inset 0 -2px 3px rgba(15,23,42,.10) !important;
}


/* Click feel */

html body .ft-engine-card[data-engine]
.ft-engine-foot > :last-child:active {

    transform:
        translateY(0)
        scale(.96) !important;
}