
.ard-page{
    max-width:1250px;
    margin:auto;
    padding:55px 30px 100px;
}


.ard-top{
    padding:32px 35px;

    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:30px;

    border-radius:23px;

    color:#fff;

    background:
        linear-gradient(
            135deg,
            #0c3428,
            #19523b
        );
}


.ard-kicker{
    margin:0;

    color:#dff25c;

    font-size:.62rem;
    font-weight:850;
    letter-spacing:.14em;
}


.ard-top h1{
    margin:7px 0 6px;

    font-size:
        clamp(
            2.3rem,
            4vw,
            4rem
        );

    line-height:.95;
    letter-spacing:-.055em;
}


.ard-top>div>p:last-child{
    margin:0;
    color:#bdd0c4;
}


.ard-top-actions{
    display:flex;
    gap:7px;
    flex-wrap:wrap;
}


.ard-button{
    min-height:43px;
    padding:0 15px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    border:0;
    border-radius:10px;

    color:#fff;
    background:#174b36;

    text-decoration:none;

    font-size:.63rem;
    font-weight:850;
}


.ard-button-light{
    border:1px solid rgba(255,255,255,.18);
    background:rgba(255,255,255,.08);
}


.ard-button-pdf{
    color:#183722;
    background:#dff25c;
}


.ard-status-line{
    margin-top:11px;
    padding:14px 17px;

    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;

    border:1px solid #dce4de;
    border-radius:13px;

    background:#f5f8f5;
}


.ard-status-line span{
    color:#75847b;
    font-size:.57rem;
    font-weight:800;
}


.ard-status-line strong{
    color:#315542;
    font-size:.65rem;
}


.ard-status-line
.ard-separator{
    width:1px;
    height:18px;

    margin:0 5px;

    background:#d4ded6;
}


.ard-grid{
    margin-top:12px;

    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
}


.ard-panel{
    margin-top:12px;
    padding:22px;

    border:1px solid #dce4de;
    border-radius:17px;

    background:#fff;

    box-shadow:
        0 10px 30px
        rgba(15,43,30,.045);
}


.ard-grid .ard-panel{
    margin-top:0;
}


.ard-panel-label{
    margin:0 0 9px;

    color:#668074;

    font-size:.58rem;
    font-weight:850;
    letter-spacing:.13em;
}


.ard-panel h2{
    margin:0;

    color:#183528;

    font-size:1.25rem;
}


.ard-data{
    margin-top:14px;

    display:grid;
    gap:7px;
}


.ard-data>div{
    padding:10px 11px;

    display:flex;
    justify-content:space-between;
    gap:20px;

    border-radius:9px;

    background:#f5f8f5;
}


.ard-data span{
    color:#7b8980;
    font-size:.62rem;
}


.ard-data strong{
    color:#365744;
    font-size:.67rem;
    text-align:right;
}


.ard-description>p:last-child{
    margin:0;

    color:#5f6f65;

    font-size:.78rem;
    line-height:1.7;
}


.ard-panel-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;
}


.ard-panel-header a{
    color:#315e47;
    font-size:.64rem;
    font-weight:800;
    text-decoration:none;
}


.ard-money{
    margin-top:18px;

    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:8px;
}


.ard-money>div{
    padding:17px;

    border-radius:12px;

    background:#eef4ef;
}


.ard-money span{
    display:block;

    color:#697d70;

    font-size:.56rem;
    font-weight:850;
}


.ard-money strong{
    display:block;
    margin-top:6px;

    color:#17452f;

    font-size:1.25rem;
}


.ard-note{
    margin-top:10px;
    padding:14px;

    border-radius:11px;

    background:#f7f9f7;
}


.ard-note span{
    color:#6c7f73;

    font-size:.56rem;
    font-weight:850;
}


.ard-note p{
    margin:5px 0 0;

    color:#67766d;
    font-size:.70rem;
    line-height:1.55;
}


.ard-empty{
    margin-top:13px;
    padding:15px;

    border-radius:10px;

    color:#77857c;
    background:#f4f7f4;

    font-size:.70rem;
}


.ard-payments{
    display:grid;
    gap:6px;
}


.ard-payments>div{
    padding:11px 12px;

    display:grid;
    grid-template-columns:1fr auto auto auto;
    gap:13px;
    align-items:center;

    border-radius:9px;

    background:#f5f8f5;
}


.ard-payments strong{
    color:#315542;
    font-size:.66rem;
}


.ard-payments span,
.ard-payments small{
    color:#76857c;
    font-size:.62rem;
}


.ard-bottom{
    margin-top:17px;

    display:flex;
    justify-content:flex-end;
    gap:8px;
}


@media(max-width:750px){

    .ard-page{
        padding:30px 15px 70px;
    }

    .ard-top{
        align-items:flex-start;
        flex-direction:column;
    }

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

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

    .ard-payments>div{
        grid-template-columns:1fr 1fr;
    }

    .ard-bottom{
        flex-direction:column;
    }
}



/*
 * ===========================================================
 * ABITAPRONTO24_REQUEST_DETAIL_LARGE_TEXT_V3
 * ===========================================================
 */

.ard-page{
    font-size:18px;
}


/* TESTATA */

.ard-kicker{
    font-size:.90rem;
}

.ard-top h1{
    font-size:
        clamp(
            3rem,
            4.7vw,
            4.8rem
        );
}

.ard-top>div>p:last-child{
    font-size:1.05rem;
}


/* PULSANTI */

.ard-button{
    min-height:50px;
    padding:0 20px;

    font-size:.90rem;
}


/* STATO / CATEGORIA / URGENZA */

.ard-status-line span{
    font-size:.82rem;
}

.ard-status-line strong{
    font-size:1rem;
}


/* TITOLI */

.ard-panel-label{
    font-size:.84rem;
}

.ard-panel h2{
    font-size:1.65rem;
}


/* DATI CLIENTE / PROFESSIONISTA */

.ard-data span{
    font-size:.90rem;
}

.ard-data strong{
    font-size:1rem;
}


/* DESCRIZIONE */

.ard-description>p:last-child{
    font-size:1.08rem;
    line-height:1.75;
}


/* LINK MODIFICA */

.ard-panel-header a{
    font-size:.92rem;
}


/* IMPORTI */

.ard-money span{
    font-size:.82rem;
}

.ard-money strong{
    font-size:1.70rem;
}


/* NOTE */

.ard-note span{
    font-size:.82rem;
}

.ard-note p{
    font-size:1rem;
    line-height:1.65;
}


/* TESTI DI STATO VUOTO */

.ard-empty{
    font-size:1rem;
}


/* PAGAMENTI */

.ard-payments strong{
    font-size:.96rem;
}

.ard-payments span,
.ard-payments small{
    font-size:.90rem;
}


@media(max-width:750px){

    .ard-page{
        font-size:16px;
    }

    .ard-description>p:last-child{
        font-size:1rem;
    }

    .ard-button{
        font-size:.82rem;
    }
}

