/* ============================================================
   alter-cart.css — Lot 5e extraction (2026-04-24)
   Source: custom.css original lines 518-771 (MODAL CART, 254 l.)
           + lines 832-1243 (CART PAGE, 412 l.) — total 666 l.
   Priority: 90 (declared in theme.yml, between alter-product=80
              and alter-carousel=150).
   Cascade: loads BEFORE custom.css (priority 1000). Mobile rules
            in custom.css @media(max-width:991.98px) keep overriding
            these desktop rules as expected.
   ============================================================ */

/* ============ MODAL CART ============ */
#blockcart-modal .modal-dialog {
    width: 1000px;
    max-width: 100%
}

#blockcart-modal .modal-content {
    border-radius: 8px;
    border: none
}

#blockcart-modal .modal-body > .row {
    margin: 0
}

#blockcart-modal .modal-header {
    border-bottom: 1px solid var(--as-grey-100);
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    padding: 16px 0
}

#blockcart-modal .modal-body {
    padding: 0
}

#blockcart-modal #cartModalLabel img {
    margin-right: 8px
}

#blockcart-modal .modal-title {
    font-weight: 500;
    text-align: center;
    font-size: 22px
}

#blockcart-modal .product-name {
    color: var(--as-grey-900);
    font-weight: 500;
    font-size: 20px;
    margin-bottom: 6px;
    letter-spacing: inherit
}

#blockcart-modal .name-and-qty {
    display: inline-flex;
    justify-content: start;
    align-items: center;
    width: 100%
}

#blockcart-modal .product-brand {
    color: var(--as-grey-300);
    font-size: 14px;
    margin-bottom: 8px;
    text-transform: uppercase
}

#blockcart-modal .product-quantity {
    display: contents
}

#blockcart-modal .product-quantity strong {
    margin-left: 16px;
    color: var(--as-black)
}

#blockcart-modal .divide-right .row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0
}

#blockcart-modal .divide-right {
    border: none;
    padding: 32px 0
}

#blockcart-modal .right-modal-cart {
    border-left: 1px solid var(--as-grey-100);
    padding: 0
}

#blockcart-modal .cart-content {
    padding: 0
}

#blockcart-modal .cart-content p.product-total {
    background: none;
    border-top: 1px solid var(--as-grey-100);
    margin: 0;
    padding: 16px 24px;
}

#blockcart-modal .cart-content p.cart-products-count {
    color: var(--as-grey-300);
    font-size: 16px;
    font-weight: 400;
    border-bottom: 1px solid var(--as-grey-100);
    padding: 16px 24px;
    margin: 0
}

#blockcart-modal .cart-content p .label {
    color: var(--as-grey-900);
    font-size: 16px;
    font-weight: 500
}

#blockcart-modal .cart-content p .value {
    font-size: 21px;
    font-weight: 500;
    color: var(--as-grey-900)
}

#blockcart-modal .shipping-hints {
    background: var(--as-papaya);
    display: flex;
    justify-content: start;
    align-items: center;
    padding: 12px;
    margin: 0 16px 12px 16px;
    border-radius: 8px;
    gap: 16px
}

#blockcart-modal .shipping-hints img {
    width: 30px;
    max-width: 100%;
}

#blockcart-modal .shipping-hints p {
    margin-bottom: 0;
    font-weight: 400;
    font-size: 16px;
    color: var(--as-grey-900)
}

#blockcart-modal .shipping-hints p:first-child {
    margin-bottom: 6px;
    font-weight: 600
}

#blockcart-modal .cart-content .cart-content-btn {
    flex-direction: column;
    width: 100%
}

#blockcart-modal .cart-content .cart-content-btn a, #blockcart-modal .cart-content .cart-content-btn button {
    width: 100%;
    font-size: 16px;
    font-weight: 400;
}

#blockcart-modal .cart-content .cart-content-btn .btn.btn-primary, .cart-summary .btn-primary {
    background: var(--as-amaranth);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px
}
#blockcart-modal .cart-content .cart-content-btn .btn.btn-primary{margin: 0}

#blockcart-modal .cart-content .cart-content-btn .btn.btn-primary:hover,.cart-summary .btn-primary:hover {
    background: linear-gradient(180deg, var(--as-black) 0%, var(--as-grey-700) 100%);
}

#blockcart-modal .cart-content .cart-content-btn .btn.btn-primary img, .cart-summary .btn-primary img {
    margin-right: 6px;
    width: 32px
}

#blockcart-modal .cart-content .cart-content-btn .btn.btn-secondary {
    background: none;
    border: none;margin: 0 ;
    padding: 20px 16px 26px 16px;
}

#blockcart-modal .gift-banner, #cart .gift-banner {
    display: flex;
    background: var(--as-grey-200);
    padding: 24px 32px;
    align-items: center;
    justify-content: space-between;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px
}

#cart .gift-banner {
    border-radius: 3px;
    margin-top: 32px
}

#blockcart-modal .gift-banner .h6, #cart .gift-banner .h6 {
    font-size: 20px;
    font-weight: 500;
    color: var(--as-grey-900);
    margin-bottom: 4px
}

#blockcart-modal .gift-banner p, #cart .gift-banner p {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    margin-bottom: 0
}

#blockcart-modal .gift-banner a, #cart .gift-banner a {
    color: var(--as-grey-900);
    text-decoration: underline;
    font-weight: 500
}

#blockcart-modal .gift-banner a:hover, #cart .gift-banner a:hover {
    text-decoration: none
}

#blockcart-modal .gift-banner img, #cart .gift-banner img {
    width: 43px;
    margin-right: 32px;
}

#blockcart-modal .product-price, #cart .gift-banner .product-price {
    color: var(--as-amaranth);
    font-size: 18px;
    font-weight: 500
}

#blockcart-modal p.modal-subtotal {
    border-bottom: 1px solid var(--as-grey-100);
    margin: 0;
    padding: 16px 24px
}

#blockcart-modal p.modal-shipping {
    padding: 16px 24px;
    margin: 0;
    font-weight: 500;
    font-size: 16px
}

#blockcart-modal .modal-header .close {
    margin-top: 4px;
    padding-right: 15px
}

#blockcart-modal .product-image {
    width: 100%;
    height: auto;
}



/* ============ CART PAGE ============ */

/* =========================================
   Panier – spinner quantité custom
   ========================================= */
#cart #cart-subtotal-discount{padding: 27px 32px;margin: 0}
#cart .quantity-field.bootstrap-touchspin {
    display: flex; /* réordonne les enfants */
    background: var(--as-grey-100);
    border-radius: 4px;
    overflow: hidden;
    width: 120px;
    max-width: 100%
    /* coins arrondis propres */
}

#cart .product-line-grid-right .cart-line-product-actions .remove-from-cart {
    margin-top: 0;
}

/* ---------- input (chiffre) ---------- */
#cart .quantity-field.bootstrap-touchspin input {
    order: 1; /* 1er dans le flux */
    flex: 1 1 0;
    min-width: 3.5rem;
    text-align: center;
    border: none;
    background: transparent;
    font-weight: 500;
    padding: .5rem .75rem;
    -moz-appearance: textfield; /* supprime les flèches nat. Firefox */
}

#cart .quantity-field.bootstrap-touchspin input::-webkit-outer-spin-button,
#cart .quantity-field.bootstrap-touchspin input::-webkit-inner-spin-button {
    -webkit-appearance: none; /* supprime flèches nat. Chrome */
}

/* ---------- boutons +- communs ---------- */
#cart .btn-touchspin {
    flex: 0 0 2.4rem; /* même largeur que le design */
    padding: 0;
    border: none;
    background: transparent;
    position: relative;
    color: transparent; /* masque le texte ‘-’ / ‘+’  */
}

/* icône en ::before */
#cart .btn-touchspin::before {
    content: '';
    position: absolute;
    inset: 0;
    margin: auto;
    width: 1em;
    height: 1em;
    background: center/contain no-repeat;
}

/* ordre + icônes */
#cart .bootstrap-touchspin-down {
    order: 2;
}

#cart .bootstrap-touchspin-down::before {
    background-image: url("../img/moins-icon.svg");
}

#cart .bootstrap-touchspin-up {
    order: 3;
}

#cart .bootstrap-touchspin-up::before {
    background-image: url("../img/plus-icon.svg");
}

@media (min-width: 768px) {
    #cart .product-line-grid {
        display: flex;
        align-items: center;
        padding: 0 32px
    }

    #cart #wrapper {
        padding: 32px
    }

    #cart .cart-grid-body .card-block, #altergifts-widget h2 {
        padding: 22px 32px
    }

    #cart .product-line-grid-left {
        padding-left: 0
    }
}

@media (min-width: 1500px) {
    #cart #wrapper {
        padding: 32px 64px
    }
}

@media (max-width: 950px) {
    #cart #wrapper {
        padding: 32px 16px
    }

}

@media (max-width: 1000px) {
    #cart .gift-more {
        margin-top: 16px;
        text-align: right;
        width: 100%;
    }
}

@media (max-width: 836px) {
    #cart .gift-banner img {
        margin: 0 auto 16px auto
    }
}

.goodies-block {
    justify-content: space-between;
    width: 100%;
}

.goodies-content {
    display: flex;
    justify-content: start;
    align-items: center;
}

#cart .js-cart-summary-totals {
    padding: 27px 32px;
    border-bottom: 1px solid var(--as-grey-100);
}

#cart .card-block.cart-detailed-subtotals + .cart-summary-totals .cart-total {
    border: none;
    padding: 0
}

#cart .cart-grid-right .cart-summary {
    border-radius: 8px;
}

 .cart-grid-right .cart-summary h3,#checkout #promo-code h3 {
    border: none;

    margin-bottom: 0;
    color: var(--as-grey-300);
    font-size: 15px;
    font-weight: 500;
    text-transform: uppercase;


}

.cart-grid-right .cart-summary h3{padding: 24px 32px 16px 31px;border-bottom: 1px solid var(--as-grey-100)}

 .block-promo {

    padding: 27px 32px 23px 32px;margin: 0;
}
.cart-grid-right .promo-discounts .cart-summary-line .label .code{    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 12px;font-weight: 500;
    text-decoration-color:  var(--as-amaranth);color:var(--as-grey-900) }
.cart-grid-right .promo-discounts .cart-summary-line .label{color:var(--as-grey-900)}
.promo-highlighted{text-align: left;padding-bottom: 16px;margin-top:16px}
.block-promo .promo-name{color:var(--as-grey-900);padding: 0 0 16px 0;margin: 0}
.block-promo .promo-name .cart-summary-line span{color:var(--as-grey-900)}
.cart-grid-right .promo-discounts{text-align: left;padding:0}

.cart-grid-right .promo-discounts .cart-summary-line .label .code:hover{text-decoration: none}
#loyalty-advantages-cart {
    padding: 22px 20px
}

.block-promo .promo-input {
    font-size: 24px;
    font-weight: 500;
    text-align: center;
    border-radius: 3px;
    width: 100%
}
.block-promo .promo-code{padding:16px 0 0 0 }
 #promo-code .promo-code form, #checkout #promo-code .promo-code form {
    display: flex;
    align-items: center
}

.block-promo .promo-input + button {
    margin: 0
}

#cart .cart-item {
    border-top: 1px var(--as-grey-100) solid
}

#cart .cart-grid-body .cart-overview {
    padding: 0
}

#cart .cart-detailed-subtotals .label {
    font-size: 16px;
    font-weight: 500
}
 #promo-code h3{padding-left: 0;padding-right: 0;border-bottom: none}
#cart #cart-subtotal-products, #cart #cart-subtotal-shipping {
    padding: 27px 32px;
    border-bottom: 1px solid var(--as-grey-100);
    margin-bottom: 0
}

#cart .cart-summary-line#cart-subtotal-products .value {
    font-size: 16px;
    font-weight: 600
}
.card-block.cart-summary-totals .cart-summary-line.cart-total .value{font-size: 26px}

#cart .cart-summary-line#cart-subtotal-shipping .value {
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 600
}

#cart .js-cart-detailed-subtotals {
    padding: 0
}

#cart .price .product-price strong {
    font-weight: 500;
    font-size: 20px
}

#cart .card.cart-container {
    border-radius: 8px;
    margin-bottom: 32px
}

#cart .quantity-field .input-group-btn {
    width: 100%;
    background: var(--as-grey-100);
    height: 40px;
    order: 2;
    display: flex;
    justify-content: center;
    align-items: center
}

#cart .bootstrap-touchspin-down {
    position: absolute;
    right: 0;
    width: 100%
}

.special-offer {
    background: linear-gradient(159deg, var(--as-black) 20.53%, var(--as-grey-700) 85.89%);
    border-radius: 8px;
    padding: 12px 20px;
    color: var(--as-grey-100);
    margin-top: 16px
}

.special-offer .special-offer-title {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 6px
}

.special-offer .special-offer-text {
    font-size: 14px;
    line-height: 18px;
    font-weight: 400;
    margin-bottom: 6px
}

.special-offer .special-offer-bottom {
    display: inline-flex;
    justify-content: start;
    align-items: center
}

.special-offer .special-offer-tag {
    background: var(--as-amaranth);
    padding: 10px;
    margin-left: 6px;
    text-transform: uppercase
}

.cart-grid-body .card-block h1, #altergifts-widget h2 {
    text-transform: capitalize;
    font-weight: 500;
    font-size: 32px
}

.product-line-grid-body > .product-line-info > .label, #altergifts-widget h4 a {
    font-size: 20px;
    font-weight: 500;
    color: var(--as-grey-900);
    text-transform: capitalize
}

.product-line-grid-body > .product-line-info > .label:hover {
    color: var(--as-black);
    text-decoration: underline
}

.product-line-grid-body .product-brand, #altergifts-widget h5 a {
    color: var(--as-grey-300);
    font-size: 14px;
    margin-bottom: 8px;
    text-transform: uppercase;
    font-weight: 400
}

.product-line-grid-body .product-price {
    color: var(--as-grey-900);
    font-weight: 500;
    margin-top: 8px
}

.product-line-grid-body .product-line-info {
    margin-bottom: 4px
}

.product-line-grid-body .js-cart-line-product-quantity {
    width: 100%
}

.product-line-grid-right .product-price {
    color: var(--as-amaranth);
    font-weight: 500;
    font-size: 20px
}

#cart .product-badges-info {
    margin: 0
}

#cart .cart-grid-body {
    margin-bottom: 32px
}

.product-line-grid-right .qty .bootstrap-touchspin {
    display: flex;
    width: 100%;
    background: var(--as-grey-100)
}

.block-promo .promo-input {
    border: none;
    background: var(--as-grey-100)
}

.rea-relou {
    display: inline-flex;
    justify-content: start;
    align-items: center;
    width: 100%;
    background: var(--as-white);
    border-radius: 8px;
    border: 3px solid var(--as-black);
}

 .cart-summary #promo-code .btn-primary,#checkout .block-promo .promo-input+button {
    height: 40px;
    font-weight: 500;
    border: 1px solid var(--as-amaranth);
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
     background: var(--as-amaranth);
}
#checkout .media-body a,#checkout .product-price,#checkout .product-line-info  .value{color:var(--as-grey-900);font-weight: 500}
body#checkout section.checkout-step .add-address{margin-bottom: 32px}
#cart .card-block.checkout {
    padding: 0
}

.has-discount .discount {
    background: var(--as-success);
    color: var(--as-grey-900);
    font-size: 16px;
    font-weight: 500
}

#cart .product-line-grid-left img {
    width: 150px;
}


#cart .card-block.checkout .btn-primary {
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px
}

#cart .no-items {
    padding: 0 32px
}

#cart .cart-container {
    padding-bottom: 32px
}

.rea-relou img {
    width: 135px;
}


/* ============================================================
   Mobile rules (Lot 5e-mobile-cart, 2026-04-24)
   Source: custom.css original lines 684-853 (170 l.):
           - PANIER MOBILE                        (54 l.) cart page layout
           - MODAL CART MOBILE                    (48 l.) blockcart-modal responsive
           - Cart modal - ameliorations mobile   (68 l.) modal polish
   Wrapper: @media (max-width: 991.98px) - matches the parent
            @media block in custom.css (zone 16) from which these
            rules were extracted as part of Option A
            (monolithic mobile @media deconstruction).
   ============================================================ */
@media (max-width: 991.98px) {
    /*PANIER MOBILE*/
    #cart .cart-grid-body{padding: 0}
    .goodies-content, .goodies-block {
        flex-direction: column
    }

    #cart .rea-relou {
        display: flex;
        flex-direction: column;
        margin-top: 16px
    }

    #cart .rea-relou-info {
        margin-top: 16px
    }

    #cart .card.cart-container {
        background: var(--as-white)
    }

    #cart .product-line-grid-body {
        margin-bottom: 0
    }

    #cart .product-line-grid-right .cart-line-product-actions .remove-from-cart {
        margin-top: 16px;
        width: 19px;

    }

    .cart-grid-body .card-block, .cart-grid-body .cart-overview, #altergifts-widget h2 {
        padding: 16px
    }

    .product-line-grid-body > .product-line-info > .label, #altergifts-widget h4 a {
        font-size: 16px
    }

    #cart .cart-grid-right .cart-summary {
        background: var(--as-white)
    }

    #cart .price-qty {
        float: none
    }

    #cart .float-right {
        float: right;
    }

    .rea-relou {
        margin-top: 16px
    }

    /*MODAL CART MOBILE*/
    #blockcart-modal .modal-body .divide-right span {
        display: inline-block
    }



    #blockcart-modal .right-modal-cart {
        border: none
    }

    #blockcart-modal .gift-banner {
        margin-top: 5px;
        flex-direction: column
    }

    .gift-banner .align-items-center {
        flex-direction: column
    }


    #blockcart-modal .gift-banner img {
        margin: 0 0 16px 0
    }

    #blockcart-modal .gift-banner .h6 {
        margin-bottom: 16px
    }

    #blockcart-modal .modal-title {
        font-size: 16px
    }

    #blockcart-modal .product-name {
        font-size: 19px;
        margin-bottom: 0;
        padding: 0
    }
    .gift-more{margin-top: 1rem}

    #blockcart-modal .cart-content p .value {
        font-size: 16px
    }

    #blockcart-modal .divide-right {
        padding: 0
    }

    /* Cart modal — améliorations mobile */
    #blockcart-modal .modal-dialog {
        margin: 0
    }

    /* un peu de marge bordure-écran */
    #blockcart-modal .name-and-qty {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 8px;
    }

    #blockcart-modal .price-col {
        margin-top: 8px;
    }

    #blockcart-modal .price-col .product-price {
        text-align: right;
    }

    #blockcart-modal .divide-right {
        border-right: 0;
    }

    /* pas de séparateur en mobile */
    #blockcart-modal .modal-img {
        width: 35%
    }

    #blockcart-modal .modal-info-product {
        width: 65%;
        padding: 24px 16px;
    }

    #blockcart-modal .product-brand {
        margin-bottom: 8px
    }

    #blockcart-modal .name-and-qty {
        justify-content: start
    }

    #blockcart-modal .product-price {
        padding-left: 0;
        font-size: 21px
    }

    #blockcart-modal .cart-content p.cart-products-count {
        font-size: 15px
    }

    #blockcart-modal .modal-content {
        width: calc(100% - 24px);
        margin: 12px auto;
        border-radius: 8px;
    }

    #blockcart-modal .modal-header .close {
        position: relative;
        top: -5px
    }

    #blockcart-modal .modal-body .divide-right span.badge {
        font-size: 12px;
        padding: 4px 12px
    }
}

/* -----------------------------------------------------------
   Lot 5h-3 — altergifts-widget + cart-items XS (from custom.css l.761-777)
   Migrated @media max-width:575px block intact (module altergifts
   currently absent from FS and DB — rules preserved as defensive
   dead code per D-007 prudence principle).
   Pattern D-009: no nested comment delimiters in headers.
   ----------------------------------------------------------- */
@media (max-width: 575px) {
    #cart .cart-items {
        padding: 0;
    }

    #altergifts-widget .actions {
        margin-top: 16px
    }

    #altergifts-widget .content {
        flex-direction: column
    }

    .first-content-gift {
        flex-direction: column
    }
}