/**
 * Apps Manager
 * Frontend Styles
 */


/* Container principal */
.apps-manager-wrapper {

    width: 100%;
    margin: 30px auto;

}



/* Tabela */
.apps-manager-table {

    width: 100%;
    border-collapse: collapse;
    background: #ffffff;
    border-radius: 10px;
    overflow: hidden;

}



.apps-manager-table th {

    background: #f5f5f5;
    padding: 15px;
    text-align: left;
    font-weight: 600;
    color: #333;

}



.apps-manager-table td {

    padding: 15px;
    border-bottom: 1px solid #eeeeee;
    vertical-align: middle;

}



.apps-manager-table tr:last-child td {

    border-bottom: none;

}



.apps-manager-table tr:hover {

    background: #fafafa;

}




/* Imagem do App */
.apps-manager-image {

    width: 60px;
    height: 60px;
    object-fit: contain;
    border-radius: 8px;

}




/* Nome */
.apps-manager-title {

    font-size: 18px;
    font-weight: 600;
    color: #222;

}



.apps-manager-description {

    font-size: 14px;
    color: #666;
    margin-top: 5px;

}




/* Categoria */

.apps-manager-category {

    display: inline-block;
    background: #eeeeee;
    padding: 5px 10px;
    border-radius: 20px;
    font-size: 12px;
    margin-right: 5px;

}




/* Botão */

.apps-manager-button {


    display: inline-block;

    padding: 10px 20px;

    border-radius: 6px;

    color: #ffffff;

    text-decoration: none;

    font-weight: 600;

    transition: .3s;


}



.apps-manager-button:hover {

    opacity: .85;
    color:#ffffff;

}





/* App Destaque */

.apps-manager-highlight {

    position: relative;

    background: #fffbea;

}



.apps-manager-highlight::before {


    content:"Destaque";

    position:absolute;

    top:10px;

    right:10px;

    background:#ffb400;

    color:#fff;

    padding:4px 10px;

    font-size:11px;

    border-radius:20px;


}




/* Paginação */

.apps-manager-pagination {


    margin-top:30px;

    text-align:center;


}



.apps-manager-pagination a,
.apps-manager-pagination span {


    display:inline-block;

    padding:8px 14px;

    margin:0 3px;

    border-radius:5px;

    background:#f1f1f1;

    color:#333;

    text-decoration:none;


}



.apps-manager-pagination .current {


    background:#2271b1;

    color:#fff;


}





/* Responsivo Tablet */

@media(max-width:768px){


    .apps-manager-table {

        display:block;

        border:0;

    }



    .apps-manager-table thead {

        display:none;

    }



    .apps-manager-table tbody,
    .apps-manager-table tr,
    .apps-manager-table td {

        display:block;

        width:100%;

    }



    .apps-manager-table tr {


        margin-bottom:20px;

        border:1px solid #eee;

        border-radius:10px;

        padding:15px;

        background:#fff;


    }



    .apps-manager-table td {


        border:none;

        padding:8px 0;


    }



    .apps-manager-button {


        width:100%;

        text-align:center;

        margin-top:10px;


    }


}





/* Cards alternativos */

.apps-manager-grid {


    display:grid;

    grid-template-columns:

    repeat(auto-fit,minmax(250px,1fr));

    gap:20px;


}



.apps-manager-card {


    background:#fff;

    border-radius:12px;

    padding:20px;

    box-shadow:0 5px 20px rgba(0,0,0,.08);

    transition:.3s;


}



.apps-manager-card:hover {


    transform:translateY(-5px);


}



.apps-manager-card img {


    max-width:80px;

    margin-bottom:15px;


}