/*==========================================================
ETALASEINFRA CORE
Kategori Produk
==========================================================*/

/*==============================
DESKTOP
==============================*/

.ei-category-wrapper{

    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:14px;

    width:100%;

    margin:30px auto 45px;

}

.ei-category{

    display:flex;
    justify-content:center;
    align-items:center;

    height:48px;

    padding:0 26px;

    background:#F3C951;

    border:1px solid #E5BE45;

    border-radius:30px;

    text-decoration:none;

    transition:.25s;

    box-shadow:0 2px 8px rgba(0,0,0,.08);

}

.ei-category:hover{

    background:#374572;

    border-color:#374572;

    transform:translateY(-2px);

}

.ei-category.active{

    background:#374572;

    border-color:#374572;

}

.ei-category-title{

    font-size:15px;

    font-weight:700;

    color:#374572;

    white-space:nowrap;

}

.ei-category:hover .ei-category-title,
.ei-category.active .ei-category-title{

    color:#ffffff;

}


/*==============================
TABLET
==============================*/

@media (max-width:1024px){

.ei-category{

    padding:0 20px;

    height:46px;

}

.ei-category-title{

    font-size:14px;

}

}


/*==============================
MOBILE
==============================*/

@media (max-width:767px){

.ei-category-wrapper{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:12px;

    width:100%;

    margin:25px auto;

}

/* Tombol Semua */

.ei-category:first-child{

    grid-column:1 / 4;

    width:150px;

    justify-self:center;

}

/* Semua tombol */

.ei-category{

    width:100%;

    height:46px;

    padding:0 6px;

    border-radius:25px;

    box-sizing:border-box;

}

/* Tulisan */

.ei-category-title{

    font-size:12px;

    font-weight:700;

    text-align:center;

    white-space:nowrap;

}

}