/* ======================================================
   SHOP INFOTEK
   CATÁLOGO
   ====================================================== */


/* ==========================================
   FILTRO DE CATEGORÍAS
========================================== */

.categorias{

    margin:35px 0 45px;

}

.categorias label{

    font-weight:700;
    margin-bottom:8px;

}

.categorias .form-select{

    max-width:380px;
    margin:auto;
    border-radius:12px;
    border:1px solid #ced4da;
    padding:12px 15px;
    font-size:1rem;
    transition:.30s;

}

.categorias .form-select:focus{

    border-color:#0d6efd;
    box-shadow:0 0 10px rgba(13,110,253,.20);

}


/* ==========================================
   TÍTULOS DEL CATÁLOGO
========================================== */

.productos{

    margin-top:10px;

}

.productos h2{

    font-size:2rem;
    font-weight:700;
    margin-bottom:40px;
    text-align:center;

}


/* ==========================================
   CABECERA DE CATEGORÍA
========================================== */

.categoria-header{

    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-top:55px;
    margin-bottom:25px;
    border-bottom:2px solid #ececec;
    padding-bottom:12px;

}

.categoria-header:first-child{

    margin-top:10px;

}

.categoria-titulo{

    font-size:1.55rem;
    font-weight:700;
    color:#212529;

}

.categoria-titulo i{

    color:#0d6efd;
    margin-right:10px;

}

.ver-todos{

    font-size:.95rem;
    font-weight:600;
    color:#0d6efd;

}

.ver-todos:hover{

    color:#084298;

}


/* ==========================================
   TARJETA
========================================== */

.card{

    border:none;
    border-radius:15px;
    overflow:hidden;
    background:#fff;
    transition:.30s;
    box-shadow:0 5px 15px rgba(0,0,0,.08);
    height:100%;

}

.card:hover{

    transform:translateY(-6px);
    box-shadow:0 15px 35px rgba(0,0,0,.15);

}


/* ==========================================
   IMAGEN
========================================== */

.card-img-top{

    width:100%;
    height:240px;
    object-fit:contain;
    background:#fff;
    padding:18px;

}


/* ==========================================
   CUERPO
========================================== */

.card-body{

    display:flex;
    flex-direction:column;

}

.card-title{

    font-size:1.05rem;
    font-weight:700;
    min-height:52px;

}

.card-text{

    color:#6c757d;
    font-size:.92rem;
    min-height:65px;

}


/* ==========================================
   PRECIO
========================================== */

.precio{

    font-size:1.40rem;
    font-weight:700;
    color:#0d6efd;

}


/* ==========================================
   STOCK
========================================== */

.stock{

    color:#198754;
    font-weight:600;
    margin-bottom:15px;

}


/* ==========================================
   BOTONES
========================================== */

.card .btn{

    border-radius:8px;

}

.card .btn-primary{

    font-weight:600;

}


/* ==========================================
   SIN PRODUCTOS
========================================== */

.alert-light{

    border-radius:10px;
    background:#fff;

}

/* ==========================================
   TARJETA DE PRODUCTO
========================================== */

.producto-card{

    transition:all .30s ease;
    border-radius:15px;
    overflow:hidden;

}

.producto-card:hover{

    transform:translateY(-6px);
    box-shadow:0 15px 35px rgba(0,0,0,.15);

}

/* Imagen */

.producto-imagen{

    background:#fff;
    padding:15px;
    display:flex;
    justify-content:center;
    align-items:center;
    height:250px;

}

.producto-imagen img{

    max-height:220px;
    object-fit:contain;

}

/* Nombre */

.producto-card .card-title{

    font-size:1.05rem;
    font-weight:700;
    min-height:50px;

}

/* Descripción */

.producto-card .card-text{

    color:#6c757d;
    font-size:.90rem;
    min-height:70px;

}

/* Precio */

.producto-card .precio{

    font-size:1.45rem;
    font-weight:700;
    color:#0d6efd;
    margin-bottom:10px;

}

/* Stock */

.producto-card .stock{

    color:#198754;
    font-size:.90rem;
    margin-bottom:15px;

}

/* Botones */

.producto-card .btn{

    border-radius:8px;
}