/*
=========================================
Omdeh Pack Builder Cart
=========================================
*/

.opb-cart-wrapper{

    width:100%;

}

.opb-cart-card{

    background:#fff;

    border:1px solid #e8e8e8;

    border-radius:16px;

    margin-bottom:25px;

    overflow:hidden;

    box-shadow:0 3px 12px rgba(0,0,0,.05);

    transition:.25s;

}

.opb-cart-card:hover{

    box-shadow:0 8px 25px rgba(0,0,0,.10);

}

/*
=========================================
Header
=========================================
*/

.opb-card-header{

    padding:28px;

    text-align:center;

    background:#fafafa;

    border-bottom:1px solid #ececec;

}

.opb-product-title{

    font-size:30px;

    font-weight:700;

    color:#222;

    margin-bottom:8px;

    line-height:1.5;

}

.opb-product-subtitle{

    font-size:14px;

    color:#888;

}

/*
=========================================
Body
=========================================
*/

.opb-card-body{

    padding:25px;

}

/*
=========================================
Information Table
=========================================
*/

.opb-info-table{

    border:1px solid #efefef;

    border-radius:12px;

    overflow:hidden;

    margin-bottom:20px;

}

.opb-info-row{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:14px 18px;

    border-bottom:1px solid #f2f2f2;

    font-size:15px;

}

.opb-info-row:last-child{

    border-bottom:none;

}

.opb-info-row span:first-child,
.opb-info-row div:first-child{

    color:#666;

    font-weight:500;

}

.opb-info-row span:last-child,
.opb-info-row div:last-child{

    color:#222;

    font-weight:700;

}

/*
=========================================
Color Box
=========================================
*/

.opb-color-box{

    margin-top:22px;

}

.opb-color-title{

    font-size:15px;

    font-weight:700;

    margin-bottom:15px;

    color:#333;

}

.opb-color-list{

    display:flex;

    flex-wrap:wrap;

    gap:10px;

}

.opb-color-badge{

    background:#f5f5f5;

    border:1px solid #e2e2e2;

    border-radius:30px;

    padding:8px 16px;

    font-size:14px;

    color:#333;

    transition:.2s;

}

.opb-color-badge:hover{

    background:#222;

    color:#fff;

    border-color:#222;

}

/*
=========================================
Summary Box
=========================================
*/

.opb-summary-box{

    margin-top:25px;

    padding:18px 20px;

    background:#f8fff8;

    border:1px solid #d9edd9;

    border-radius:12px;

}

.opb-summary-row{

    display:flex;

    justify-content:space-between;

    align-items:center;

}

.opb-summary-row span{

    color:#444;

    font-size:15px;

}

.opb-summary-row strong{

    color:#1d7a35;

    font-size:22px;

    font-weight:700;

}

/*
=========================================
Footer
=========================================
*/

.opb-card-footer{

    margin-top:25px;

    text-align:center;

}

/*
=========================================
Remove Button
=========================================
*/

.opb-remove-btn{

    display:block;

    width:100%;

    background:#d63638;

    color:#fff !important;

    text-decoration:none;

    padding:14px 20px;

    border-radius:12px;

    font-size:15px;

    font-weight:700;

    transition:.25s;

    box-sizing:border-box;

}

.opb-remove-btn:hover{

    background:#b42324;

    color:#fff !important;

    transform:translateY(-1px);

}

/*
=========================================
Layout
=========================================
*/

.opb-cart-layout{

    display:flex;

    gap:30px;

    align-items:flex-start;

}

.opb-cart-products{

    flex:1;

    min-width:0;

}

.opb-cart-sidebar{

    width:360px;

    position:sticky;

    top:20px;

}

/*
=========================================
Responsive
=========================================
*/

@media (max-width:991px){

    .opb-cart-layout{

        flex-direction:column;

    }

    .opb-cart-sidebar{

        width:100%;

        position:relative;

        top:auto;

    }

    .opb-product-title{

        font-size:24px;

    }

    .opb-info-row{

        padding:12px 14px;

        font-size:14px;

    }

    .opb-summary-row strong{

        font-size:18px;

    }

    .opb-remove-btn{

        padding:12px;

    }

}