/* ETAPA 41.2 — Padronização visual e menus responsivos */

/* ===== CARDS / MINIATURAS PADRONIZADAS ===== */
.masonry .card,
.e42-masonry .e42-card{
    display:inline-flex;
    flex-direction:column;
    width:100%;
    height:430px;
    vertical-align:top;
    box-sizing:border-box;
    overflow:hidden;
}

.masonry .card-image-link,
.e42-card .e42-cover{
    display:block;
    flex:0 0 225px;
    height:225px;
    overflow:hidden;
    background:#f3f3f3;
}

.masonry .card-image,
.e42-card .e42-cover img{
    width:100%;
    height:225px !important;
    object-fit:cover;
    object-position:center;
    display:block;
}

.masonry .no-image,
.e42-card .e42-placeholder{
    width:100%;
    height:225px;
    min-height:225px !important;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
}

.masonry .card-body,
.e42-card .e42-card-body{
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
}

/* título: máximo 2 linhas */
.masonry .card h3,
.e42-card h2{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    line-clamp:2;
    overflow:hidden;
    min-height:2.5em;
    max-height:2.5em;
}

/* descrição: máximo 3 linhas */
.masonry .card-body > p,
.e42-card .e42-card-body > p{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:3;
    line-clamp:3;
    overflow:hidden;
    min-height:4.15em;
    max-height:4.15em;
}

/* rodapé permanece alinhado embaixo */
.masonry .card-footer,
.e42-card .e42-stats{
    margin-top:auto;
}

/* tags não aumentam indefinidamente o card */
.masonry .card-tags{
    max-height:30px;
    overflow:hidden;
}

/* ===== MENU SUPERIOR RESPONSIVO ===== */
.nav-actions.e412-ready{
    display:flex;
    align-items:center;
    gap:8px;
    min-width:0;
    flex-wrap:nowrap;
}

.e412-overflow{
    position:relative;
    flex:0 0 auto;
}

.e412-overflow > summary{
    list-style:none;
    cursor:pointer;
    user-select:none;
    border:0;
    border-radius:999px;
    padding:9px 12px;
    background:#f2f2f2;
    color:#111;
    font:inherit;
    font-weight:800;
    white-space:nowrap;
}

.e412-overflow > summary::-webkit-details-marker{display:none}

.e412-overflow-menu{
    position:absolute;
    right:0;
    top:calc(100% + 8px);
    z-index:1000;
    width:max-content;
    min-width:220px;
    max-width:min(340px,calc(100vw - 28px));
    padding:8px;
    background:#fff;
    border:1px solid #e5e5e5;
    border-radius:15px;
    box-shadow:0 16px 45px rgba(0,0,0,.14);
}

.e412-overflow-menu > a,
.e412-overflow-menu > .nav-link,
.e412-overflow-menu > .btn-primary{
    display:block !important;
    width:100%;
    box-sizing:border-box;
    margin:0;
    padding:10px 12px;
    border-radius:10px;
    text-decoration:none;
    white-space:normal;
}

.e412-overflow-menu > a:hover{background:#f5f5f5}

/* ===== CATEGORIAS RESPONSIVAS ===== */
.categories.e412-ready{
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:center;
    gap:8px;
    overflow:visible !important;
    min-width:0;
}

.categories.e412-ready > .category-chip{
    flex:0 0 auto;
    white-space:nowrap;
}

.e412-cat-more{
    position:relative;
    flex:0 0 auto;
}

.e412-cat-more > summary{
    list-style:none;
    cursor:pointer;
    user-select:none;
    white-space:nowrap;
    padding:9px 13px;
    border-radius:999px;
    background:#f1f1f1;
    font-weight:800;
}

.e412-cat-more > summary::-webkit-details-marker{display:none}

.e412-cat-menu{
    position:absolute;
    right:0;
    top:calc(100% + 8px);
    z-index:900;
    display:grid;
    grid-template-columns:repeat(2,minmax(130px,1fr));
    gap:5px;
    min-width:300px;
    max-width:min(440px,calc(100vw - 28px));
    max-height:60vh;
    overflow:auto;
    padding:9px;
    background:#fff;
    border:1px solid #e5e5e5;
    border-radius:15px;
    box-shadow:0 16px 45px rgba(0,0,0,.14);
}

.e412-cat-menu .category-chip{
    display:block;
    box-sizing:border-box;
    text-align:left;
    white-space:normal;
}

/* No celular o menu mobile original continua sendo a navegação principal. */
@media(max-width:760px){
    .masonry .card,
    .e42-masonry .e42-card{height:390px}

    .masonry .card-image-link,
    .masonry .card-image,
    .masonry .no-image,
    .e42-card .e42-cover,
    .e42-card .e42-cover img,
    .e42-card .e42-placeholder{
        height:190px !important;
        min-height:190px !important;
        flex-basis:190px;
    }

    .e412-cat-menu{
        right:auto;
        left:0;
        grid-template-columns:1fr;
        min-width:min(290px,calc(100vw - 28px));
    }
}

/* Compatibilidade com outras páginas que usam cards comuns */
.activity-grid .card,
.cards-grid .card,
.grid-atividades .card{
    overflow:hidden;
}