/* FILE: /v2/include/css/90-responsive.css
   COSA FA:
   Media query globali /v2.
   Gestisce adattamenti mobile/tablet/desktop comuni.
*/

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

@media (max-width: 767.98px){

    .cm-page{
        padding-left:10px;
        padding-right:10px;
    }

    .cm-box-head,
    .cm-content{
        padding:12px;
    }

    .cm-title{
        font-size:1.18rem;
    }

    .cm-subtitle{
        font-size:.86rem;
    }

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

    .cm-v2-navbar .navbar-collapse{
        padding-top:10px;
        padding-bottom:12px;
    }

    .cm-v2-navbar .nav-link{
        border-radius:12px;
    }

    .cm-v2-navbar .cm-nav-divider{
        display:none;
    }

    .cm-v2-navbar .navbar-brand{
        margin-right:8px;
    }

    .cm-v2-navbar .navbar-brand img{
        width:34px;
        height:34px;
        margin-right:6px;
    }

    .cm-v2-navbar .navbar-brand-text{
        font-size:1.05rem;
    }

    .cm-v2-navbar .navbar-toggler{
        padding:.35rem .55rem;
    }

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

    .cm-grid{
        grid-template-columns:1fr;
        gap:10px;
    }

    .cm-service{
        min-height:78px;
        padding:10px 12px;
        border-radius:18px;
    }

    .cm-service-icon{
        width:46px;
        height:46px;
        flex:0 0 46px;
        border-radius:14px;
    }

    .cm-service-icon .material-icons{
        font-size:23px;
    }

    .cm-service-title{
        font-size:.97rem;
    }

    .cm-service-subtitle{
        font-size:.80rem;
    }

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

    .kpi{
        grid-template-columns:1fr 1fr;
        gap:10px;
    }

    .kpi .box{
        padding:12px;
        border-radius:14px;
    }

    .kpi .box .v{
        font-size:1.16rem;
    }

    .cm-actions,
    .cm-actions.two-items{
        grid-template-columns:1fr;
        gap:10px;
    }

    .cm-actions .btn{
        min-height:52px;
        justify-content:flex-start;
        padding-left:14px;
        padding-right:14px;
    }

    .statusline{
        justify-content:flex-start;
    }

    .statuschip{
        width:100%;
        justify-content:flex-start;
        white-space:normal;
        line-height:1.35;
        border-radius:14px;
        padding:10px 12px;
    }

    .copy-row{
        flex-direction:column;
    }

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

    .wishlist-pill{
        border-radius:18px;
        align-items:flex-start;
    }

    .wishlist-pill .btn{
        align-self:center;
    }
}

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

@media (max-width: 575.98px){

    .grid{
        grid-template-columns:1fr;
    }

    .p-img{
        height:168px;
    }

    .p-desc{
        -webkit-line-clamp:3;
        min-height:52px;
    }

    .p-ing{
        -webkit-line-clamp:3;
    }
}

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

@media (min-width: 768px){

    .grid{
        grid-template-columns:repeat(3, minmax(0, 1fr));
    }
}

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

@media (min-width: 1100px){

    .grid{
        grid-template-columns:repeat(4, minmax(0, 1fr));
    }
}