/* =================================
   LIQUID GLASS SYSTEM
================================= */


.glass {

    background:

    linear-gradient(
        135deg,
        rgba(255,255,255,.14),
        rgba(255,255,255,.05)
    );


    border:

    1px solid rgba(255,255,255,.18);


    backdrop-filter:

    blur(18px);


    -webkit-backdrop-filter:

    blur(18px);


    box-shadow:

    0 8px 30px rgba(0,0,0,.25);

}



/* Универсальный эффект нажатия */

.glass:active {

    transform:

    scale(.97);

}



/* Стеклянные кнопки */


.glass-button {


    background:

    rgba(255,255,255,.15);


    border:

    1px solid rgba(255,255,255,.2);


    backdrop-filter:

    blur(10px);


    color:white;


}



/* Блик карточки товара */


.product::before {


    content:"";


    position:absolute;


    top:-80px;


    right:-80px;


    width:140px;


    height:140px;


    background:

    rgba(255,255,255,.12);


    filter:

    blur(40px);


    border-radius:50%;


}



/* Активное состояние */


.tap {


    transition:.25s ease;


}



.tap:active {


    transform:

    scale(.9);


}

.glass-button {

    width:42px;

    height:42px;

    border-radius:50%;

    border:

    1px solid rgba(255,255,255,.2);


    background:

    linear-gradient(
        135deg,
        rgba(255,255,255,.22),
        rgba(255,255,255,.08)
    );


    color:white;


    backdrop-filter:

    blur(12px);


    -webkit-backdrop-filter:

    blur(12px);


    box-shadow:

    0 5px 20px rgba(0,0,0,.25);


    font-size:24px;


    display:flex;

    align-items:center;

    justify-content:center;


    cursor:pointer;


    transition:

    transform .2s ease,
    background .2s ease;

}



.glass-button:active {


    transform:

    scale(.85);


    background:

    rgba(255,255,255,.3);

}