.cart-list-box {
    /*background-color: var(--secondary-color);*/
    border-radius: 10px;
    overflow:hidden;
}
.card-list-title{ 
    padding: 10px 24px; 
    background-color:var(--main-color);
}
.box-list-content{ 
    padding: 20px;
    color:#fff;
    border-radius: 10px;
    p {
        white-space: nowrap; 
        overflow: hidden; 
        text-overflow: ellipsis;
    }
}
.image{ 
    width:100%;
    height:100%;
    overflow: hidden;
    border-radius:5px;
    img{
        min-width: 100%;
        min-height: 100%;
        object-fit: cover;
    }
}
.empty-cart, .add-to-cart{
    div{
        width: 100%;
        padding:10px;
        background-color: #d1ecf1;
        margin:10px 0; 
        color: #0c5460; 
        text-align:center; 
        border-radius:10px;
    }
}
.add-to-cart{
    div{
        font-weight: bold;
        color: var(--secondary-color); 
        background: var(--gradient-5);
    }
}
.empty-cart:hover, .add-to-cart:hover{
    text-decoration: none;
    div{            
        transform: scale(1.01);
        cursor: pointer;
        box-shadow: 0px 10px 9px -8px rgba(0,0,0,0.75);
        -webkit-box-shadow: 0px 10px 9px -8px rgba(0,0,0,0.75);
        -moz-box-shadow: 0px 10px 9px -8px rgba(0,0,0,0.75);
    }
}
.finish-cart, .cupom-cart{
    width: 100%;
    outline: none;
    border: none;        
    padding:10px;
    margin:10px 0; 
    color: #fff; 
    background: var(--gradient-btn);
    text-align:center; 
    border-radius:10px;
}
.finish-cart:hover, .cupom-cart:hover{          
    transform: scale(1.01);
    cursor: pointer;
    box-shadow: 0px 10px 9px -8px rgba(0,0,0,0.75);
    -webkit-box-shadow: 0px 10px 9px -8px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 10px 9px -8px rgba(0,0,0,0.75);
}
hr {
    background-color: white;
}
.cupom-cart{
    padding: 8px;
}
.cupom-cart-orange{
    background-color: var(--main-color);
}
.cart-last-item-content{
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    gap: 5px;
    p{
        align-self: flex-end;
        text-align: end;
    }
    button{        
        flex-grow: 1;
        width: auto;
    }
    input{
        border-radius:5px;
        outline: none;
        border: none;
        width: auto;        
        flex-grow: 2;
        min-width: 0;
    }
}
/* Circulo Pix */
    .countdown-container {
        position: relative;
        width: 100%;      /* ocupa todo o espaço disponível do pai */
        max-width: 250px; /* limita o tamanho máximo (mude para o que quiser) */
        aspect-ratio: 1 / 1; /* mantém o círculo quadrado */
    }
    .progress-ring {
        position: relative;
        width: 100%;
        height: 100%;
        transform: rotate(-90deg);
    }
    .progress-ring__circle {
        transition: stroke-dashoffset 1s linear;
        stroke-linecap: round;
        stroke-dasharray: 565.48; /* 2πr (mesmo r do circle) */
        stroke-dashoffset: 0;
    }
    .time-text {
        position: absolute;
        inset: 0; /* top:0; left:0; right:0; bottom:0 */
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 2rem;
        font-weight: bold;
        color: var(--gradient-5);
    }
/* /Circulo Pix */

/* Style Modal Login*/    
.modal-login{
    position:fixed;
    display: flex;
    justify-content: center;
    align-items: center;
    width:100%;
    height:100%;
    top:0; left:0;
    background-color:#333d;
    z-index:999;
    padding: 20px;
    .clicktoexit{
        position:fixed;
        width:100%;
        height:100%;
        top:0; left:0;
        z-index: -1;
        cursor: pointer;
    }
    .modal-login-box {
        width: 100%;
        height:auto;
        max-width: 500px;
        background-color: var(--secondary-color); 
        border-radius:10px;
        .login-section, .cadastro-section{
            display: flex;
            justify-content: space-around;
            align-items: stretch;
            flex-direction: column;
            height: 100%;
            padding: 20px;
            h3{
                text-align: center;
            }
            .bb{
                border-bottom: 1px solid white;
            }
            div:not(.row){
                margin-top: 8px;
                display: flex;
                justify-content: center;
                align-items: stretch;
                flex-direction: column;
                height: 100%;
                button{
                    width: 100%;
                    outline: none;
                    border: none;        
                    padding:10px;
                    margin:10px 0; 
                    color: #fff; 
                    background: var(--gradient-btn);
                    text-align:center; 
                    border-radius:10px; 
                    margin-top: 2px; 
                }
                button:hover{          
                    transform: scale(1.01);
                    cursor: pointer;
                    box-shadow: 0px 10px 9px -8px rgba(0,0,0,0.75);
                    -webkit-box-shadow: 0px 10px 9px -8px rgba(0,0,0,0.75);
                    -moz-box-shadow: 0px 10px 9px -8px rgba(0,0,0,0.75);
                }
            }
        }
    }
}

.bg {
    background-image: url("furniture/img/new-img/bg_cart");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

.s1c {
    width: 44px; height: 44px; border-radius: 50%;
    border: 6px solid rgba(40,167,69,0.08); border-top-color: #20c954;;
    animation: spin 0.7s linear infinite;
    box-shadow: 0 0 18px rgba(40,167,69,0.28);
}
@keyframes spin { to { transform:rotate(360deg); } }