/*======================================
      PUBLICAR PRODUCTO
======================================*/

.form-publicar{
    max-width:1000px;
    margin:40px auto;
    background:#fff;
    padding:30px;
    border-radius:20px;
    box-shadow:0 10px 30px rgba(0,0,0,.12);
}

.form-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
    gap:20px;
}

.campo{
    display:flex;
    flex-direction:column;
}

.campo label{
    font-size:15px;
    font-weight:bold;
    color:#1B1240;
    margin-bottom:8px;
}

.campo input,
.campo select,
.campo textarea{

    width:100%;

    padding:12px;

    border:1px solid #dcdcdc;

    border-radius:10px;

    font-size:15px;

    transition:.3s;
}

.campo input:focus,
.campo select:focus,
.campo textarea:focus{

    border-color:#ffcc00;

    outline:none;

    box-shadow:0 0 10px rgba(255,204,0,.3);

}

.campo textarea{

    min-height:140px;

    resize:vertical;

}

/*======================================
      VISTA PREVIA DE IMÁGENES
======================================*/

.preview{

    display:flex;

    flex-wrap:wrap;

    gap:20px;

    margin-top:20px;

}

.preview img{

    width:180px;

    height:180px;

    object-fit:cover;

    border-radius:15px;

    border:3px solid #eee;

    transition:.3s;

}

.preview img:hover{

    transform:scale(1.05);

    border-color:#ffcc00;

}

/*======================================
      BOTÓN PUBLICAR
======================================*/

.acciones{

    text-align:center;

    margin-top:35px;

}

.acciones button{

    min-width:250px;

}

/*======================================
      CHECKBOX
======================================*/

.checkbox-politicas{

    display:flex;

    align-items:center;

    gap:10px;

    margin-top:20px;

}

.checkbox-politicas input{

    width:18px;

    height:18px;

}

/*======================================
      RESPONSIVE
======================================*/

@media(max-width:768px){

.form-publicar{

    margin:20px;

    padding:20px;

}

.form-grid{

    grid-template-columns:1fr;

}

.preview{

    justify-content:center;

}

.preview img{

    width:130px;

    height:130px;

}

.acciones button{

    width:100%;

}

}
/*======================================
    BOTÓN PUBLICAR PRODUCTO
======================================*/


.btn-publicar:hover{

    background:#218838;

    transform:translateY(-2px);

}

.btn-publicar i{

    font-size:18px;

}

@media(max-width:768px){

   

}
.btn-publicar{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    width:280px;

    height:55px;

    margin:25px auto;

    background:#28a745;

    color:#fff;

    text-decoration:none;

    border-radius:12px;

    font-size:18px;

    font-weight:bold;

    box-shadow:0 6px 15px rgba(0,0,0,.20);

    transition:.3s;

}

.btn-publicar:hover{

    background:#218838;

    transform:translateY(-2px);

}

.btn-publicar i{

    font-size:18px;

}

@media(max-width:768px){

    .btn-publicar{

        width:90%;
        max-width:320px;

    }

}