/* ==========================================================================
   Cart page, checkout (Shopify-style two columns) and account
   ========================================================================== */

/* Cart page ---------------------------------------------------------------- */
.cb-cart-page {
    padding-bottom: 24px;
}

.cb-cart-page .cb-h1 {
    margin: 4px 0 22px;
}

.cb-cart--page {
    display: grid;
    gap: 24px;
}

.cb-cart--page .cb-shipping-meter {
    grid-column: 1 / -1;
}

.cb-cart--page .cb-cart-lines {
    padding: 0;
    border-top: 1px solid var(--ui-200);
}

.cb-cart--page .cb-cart-line {
    grid-template-columns: 110px 1fr;
    gap: 18px;
    padding: 20px 0;
}

.cb-cart--page .cb-cart-line__image img {
    width: 110px;
}

.cb-cart--page .cb-cart-summary {
    align-self: start;
    padding: 22px;
    background: var(--cb-platinum);
    border: 0;
}

.cb-cart--page .cb-cart-empty {
    grid-column: 1 / -1;
    padding-block: 50px;
}

.cb-cart--page .cb-cart-empty__links {
    grid-auto-flow: row;
    justify-content: center;
}

@media (min-width: 992px) {
    .cb-cart--page {
        grid-template-columns: minmax(0, 1fr) 380px;
        gap: 22px 48px;
    }

    .cb-cart--page .cb-cart-summary {
        position: sticky;
        top: calc(var(--cb-header-h) + 16px);
    }

    .cb-cart--page .cb-cart-empty__links {
        grid-auto-flow: column;
    }
}

/* WooCommerce notices ------------------------------------------------------- */
.woocommerce-error,
.woocommerce-message,
.woocommerce-info {
    margin: 0 0 18px;
    padding: 14px 16px;
    list-style: none;
    border-left: 3px solid var(--cb-blue);
    background: var(--cb-platinum);
    font-size: 14px;
}

.woocommerce-error {
    border-color: var(--cb-red);
}

.woocommerce-error li + li {
    margin-top: 4px;
}

.woocommerce-info a,
.woocommerce-message a {
    text-decoration: underline;
}

/* Checkout chrome ------------------------------------------------------------ */
.cb-checkout-body {
    background: #fff;
}

.cb-checkout-header {
    background: var(--cb-blue);
}

.cb-checkout-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 1140px;
    margin: 0 auto;
    padding: 18px 20px;
}

.cb-checkout-header__logo img {
    width: 150px;
    height: auto;
}

.cb-checkout-header__bag {
    color: #fff;
}

.cb-checkout-footer {
    border-top: 1px solid var(--ui-200);
}

.cb-checkout-footer ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    max-width: 1140px;
    margin: 0 auto;
    padding: 18px 20px;
    font-size: 12px;
}

.cb-checkout-footer a {
    color: var(--cb-blue);
    text-decoration: underline;
}

/* Checkout form --------------------------------------------------------------- */
.cb-checkout .woocommerce {
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 20px;
}

.cb-checkout .woocommerce-notices-wrapper:empty {
    display: none;
}

.cb-checkout .woocommerce-form-coupon-toggle,
.cb-checkout .woocommerce-form-login-toggle {
    padding-top: 18px;
}

.cb-checkout form.checkout_coupon,
.cb-checkout form.woocommerce-form-login {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 18px;
    padding: 16px;
    border: 1px solid var(--ui-200);
    border-radius: 5px;
}

.cb-checkout form.checkout_coupon p:first-child {
    width: 100%;
    font-size: 13px;
}

form.checkout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
        "heading"
        "review"
        "details"
        "payment";
}

form.checkout #customer_details {
    grid-area: details;
}

form.checkout #order_review_heading {
    grid-area: heading;
}

form.checkout #order_review {
    grid-area: review;
}

form.checkout .woocommerce-checkout-payment {
    grid-area: payment;
}

@media (min-width: 1000px) {
    .cb-checkout-body {
        display: flex;
        flex-direction: column;
        min-height: calc(100vh - var(--wp-admin--admin-bar--height, 0px));
    }

    .cb-checkout-main {
        display: flex;
        flex: 1 0 auto;
        flex-direction: column;
    }

    .cb-checkout {
        flex: 1 0 auto;
        background: linear-gradient(90deg, #fff 0 50%, var(--ui-200) 50% calc(50% + 1px), var(--cb-platinum) calc(50% + 1px));
    }

    .cb-checkout:has(.woocommerce-order) {
        background: #fff;
    }

    .cb-checkout .woocommerce {
        background: transparent;
    }

    form.checkout {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        grid-template-rows: auto auto 1fr;
        grid-template-areas:
            "details heading"
            "details review"
            "payment review";
        column-gap: 0;
    }

    form.checkout #customer_details,
    form.checkout .woocommerce-checkout-payment {
        padding-right: 42px;
    }

    form.checkout #order_review_heading,
    form.checkout #order_review {
        padding-left: 42px;
    }

    form.checkout #order_review {
        position: sticky;
        top: 20px;
        align-self: start;
    }

    .cb-checkout .woocommerce-form-coupon-toggle,
    .cb-checkout form.checkout_coupon,
    .cb-checkout .woocommerce-form-login-toggle,
    .cb-checkout form.woocommerce-form-login,
    .cb-checkout .woocommerce-NoticeGroup {
        max-width: calc(50% - 42px);
    }
}

form.checkout h3 {
    margin: 30px 0 14px;
    font-size: 20px;
    font-weight: 600;
}

form.checkout #order_review_heading {
    margin-top: 30px;
}

.cb-checkout .col2-set .col-1,
.cb-checkout .col2-set .col-2 {
    width: 100%;
    float: none;
}

.cb-checkout .woocommerce-billing-fields__field-wrapper,
.cb-checkout .woocommerce-shipping-fields__field-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.cb-checkout .form-row {
    grid-column: 1 / -1;
    margin: 0;
    padding: 0;
}

.cb-checkout .form-row-first,
.cb-checkout .form-row-last {
    grid-column: span 1;
}

.cb-checkout #billing_first_name_field,
.cb-checkout #shipping_first_name_field {
    grid-column: 1;
}

.cb-checkout #billing_last_name_field,
.cb-checkout #shipping_last_name_field {
    grid-column: 2;
}

.cb-checkout .form-row label {
    display: block;
    margin-bottom: 4px;
    font-size: 12px;
    color: var(--ui-700);
}

.cb-checkout .form-row label .required {
    color: var(--cb-red);
    text-decoration: none;
}

.cb-checkout .form-row .optional {
    color: var(--ui-500);
}

.cb-checkout input.input-text,
.cb-checkout textarea,
.cb-checkout select,
.cb-checkout .select2-container .select2-selection--single {
    width: 100%;
    min-height: 46px;
    padding: 12px 13px;
    border: 1px solid var(--ui-300);
    border-radius: 5px;
    background: #fff;
    font-size: 14px;
    transition: border-color .15s, box-shadow .15s;
}

.cb-checkout textarea {
    min-height: 90px;
}

.cb-checkout input.input-text:focus,
.cb-checkout textarea:focus,
.cb-checkout select:focus {
    outline: none;
    border-color: var(--cb-blue);
    box-shadow: 0 0 0 1px var(--cb-blue);
}

.cb-checkout .select2-container .select2-selection--single {
    display: flex;
    align-items: center;
    padding: 0 13px;
}

.cb-checkout .select2-container--default .select2-selection--single .select2-selection__arrow {
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
}

.cb-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding: 0;
    line-height: 1.4;
}

.cb-checkout .woocommerce-invalid input.input-text {
    border-color: var(--cb-red);
}

.cb-checkout #ship-to-different-address {
    font-size: 15px;
}

.cb-checkout #ship-to-different-address label {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}

.cb-checkout .woocommerce-additional-fields h3 {
    display: none;
}

/* Order summary */
.woocommerce-checkout-review-order-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.woocommerce-checkout-review-order-table thead {
    display: none;
}

.woocommerce-checkout-review-order-table td,
.woocommerce-checkout-review-order-table th {
    padding: 8px 0;
    text-align: left;
    font-weight: 400;
    vertical-align: middle;
}

.woocommerce-checkout-review-order-table td:last-child,
.woocommerce-checkout-review-order-table tfoot td {
    text-align: right;
}

.woocommerce-checkout-review-order-table tbody td {
    padding: 10px 0;
}

.woocommerce-checkout-review-order-table tfoot tr:first-child th,
.woocommerce-checkout-review-order-table tfoot tr:first-child td {
    padding-top: 22px;
}

.woocommerce-checkout-review-order-table .order-total th,
.woocommerce-checkout-review-order-table .order-total td {
    padding-top: 14px;
    font-size: 19px;
    font-weight: 600;
}

.woocommerce-checkout-review-order-table .order-total td strong::before {
    content: "EUR ";
    font-size: 12px;
    font-weight: 400;
    color: var(--ui-700);
}

.woocommerce-checkout-review-order-table .woocommerce-shipping-methods {
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: right;
}

.woocommerce-checkout-review-order-table .woocommerce-shipping-methods li + li {
    margin-top: 4px;
}

.cb-order-item {
    display: flex;
    align-items: center;
    gap: 14px;
}

.cb-order-item__thumb {
    position: relative;
    flex: none;
    width: 64px;
    height: 64px;
    border: 1px solid var(--ui-200);
    border-radius: 8px;
    background: #fff;
}

.cb-order-item__thumb img {
    width: 100%;
    height: 100%;
    border-radius: 8px;
    object-fit: cover;
}

.cb-order-item__qty {
    position: absolute;
    top: -8px;
    right: -8px;
    min-width: 21px;
    height: 21px;
    padding: 0 6px;
    border-radius: 11px;
    background: var(--ui-700);
    color: #fff;
    font-size: 12px;
    line-height: 21px;
    text-align: center;
}

.cb-order-item__name {
    display: flex;
    flex-direction: column;
    font-weight: 500;
}

.cb-order-item__name small {
    font-size: 12px;
    font-weight: 400;
    color: var(--ui-700);
}

/* Payment */
.woocommerce-checkout-payment {
    margin-top: 28px;
    padding-bottom: 36px;
}

.woocommerce-checkout-payment::before {
    content: "Paiement";
    display: block;
    margin-bottom: 6px;
    font-size: 20px;
    font-weight: 600;
}

.woocommerce-checkout-payment ul.payment_methods {
    margin: 12px 0 18px;
    padding: 0;
    list-style: none;
    border: 1px solid var(--ui-300);
    border-radius: 5px;
    overflow: hidden;
}

.woocommerce-checkout-payment ul.payment_methods > li {
    padding: 14px 16px;
    font-size: 14px;
}

.woocommerce-checkout-payment ul.payment_methods > li + li {
    border-top: 1px solid var(--ui-300);
}

.woocommerce-checkout-payment ul.payment_methods > li > input {
    margin-right: 8px;
    accent-color: var(--cb-blue);
}

.woocommerce-checkout-payment .payment_box {
    margin: 12px -16px -14px;
    padding: 14px 16px;
    background: var(--cb-platinum);
    font-size: 13px;
    color: var(--ui-800);
}

.woocommerce-checkout-payment .woocommerce-privacy-policy-text,
.woocommerce-checkout-payment .woocommerce-terms-and-conditions-wrapper {
    margin-bottom: 14px;
    font-size: 12px;
    color: var(--ui-700);
}

.woocommerce-checkout-payment a {
    text-decoration: underline;
}

#place_order,
.cb-checkout .button,
.cb-account .button,
.cb-account button[type="submit"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 12px 22px;
    border: 0;
    border-radius: 5px;
    background: var(--cb-blue);
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
}

#place_order {
    width: 100%;
    min-height: 56px;
    font-size: 17px;
}

#place_order:hover,
.cb-checkout .button:hover,
.cb-account .button:hover {
    background: var(--cb-deep);
}

#place_order:disabled {
    background: var(--ui-300);
    cursor: not-allowed;
}

.blockUI.blockOverlay {
    background: rgba(255, 255, 255, .6) !important;
}

/* Thank you page */
.woocommerce-order {
    max-width: 640px;
    padding: 36px 0 50px;
}

.woocommerce-order .woocommerce-thankyou-order-received {
    margin-bottom: 18px;
    font-size: 22px;
    font-weight: 600;
}

.woocommerce-order-overview {
    display: grid;
    gap: 8px;
    margin: 0 0 26px;
    padding: 18px;
    border: 1px solid var(--ui-200);
    border-radius: 5px;
    list-style: none;
    font-size: 14px;
}

.woocommerce-order h2 {
    margin: 26px 0 12px;
    font-size: 18px;
}

.woocommerce-order table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.woocommerce-order table th,
.woocommerce-order table td {
    padding: 10px 0;
    border-bottom: 1px solid var(--ui-200);
    text-align: left;
}

.woocommerce-order address {
    padding: 14px;
    border: 1px solid var(--ui-200);
    border-radius: 5px;
    font-style: normal;
    font-size: 14px;
}

/* Account ------------------------------------------------------------------------ */
.cb-account {
    padding-bottom: 40px;
}

.cb-account .cb-h1 {
    margin: 4px 0 24px;
}

.cb-account .u-columns {
    display: grid;
    gap: 36px;
}

.cb-account h2 {
    margin-bottom: 14px;
    font-size: 20px;
    font-weight: 600;
}

.cb-account form .form-row {
    margin: 0 0 14px;
}

.cb-account label {
    display: block;
    margin-bottom: 4px;
    font-size: 13px;
    color: var(--ui-700);
}

.cb-account input.input-text,
.cb-account select {
    width: 100%;
    min-height: 44px;
    padding: 10px 12px;
    border: 1px solid var(--ui-300);
    border-radius: 2px;
}

.cb-account .woocommerce-form-login__rememberme {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
}

.cb-account .lost_password a,
.cb-account .woocommerce-MyAccount-content a {
    text-decoration: underline;
}

.cb-account .woocommerce-MyAccount-navigation ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 24px;
}

.cb-account .woocommerce-MyAccount-navigation a {
    display: inline-block;
    padding: 8px 14px;
    border: 1px solid var(--ui-300);
    font-size: 13px;
}

.cb-account .woocommerce-MyAccount-navigation .is-active a {
    border-color: var(--ui-900);
    background: var(--ui-900);
    color: #fff;
}

.cb-account table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.cb-account table th,
.cb-account table td {
    padding: 10px 8px;
    border-bottom: 1px solid var(--ui-200);
    text-align: left;
}

@media (min-width: 768px) {
    .cb-account .u-columns {
        grid-template-columns: 1fr 1fr;
        gap: 60px;
    }
}

@media (min-width: 992px) {
    .cb-account .woocommerce {
        display: grid;
        grid-template-columns: 240px 1fr;
        gap: 48px;
    }

    .cb-account .woocommerce > .woocommerce-notices-wrapper,
    .cb-account .woocommerce > .u-columns,
    .cb-account .woocommerce > h2,
    .cb-account .woocommerce > form {
        grid-column: 1 / -1;
    }

    .cb-account .woocommerce-MyAccount-navigation ul {
        flex-direction: column;
    }

    .cb-account .woocommerce-MyAccount-navigation a {
        display: block;
        border: 0;
        border-bottom: 1px solid var(--ui-200);
        padding: 12px 0;
    }

    .cb-account .woocommerce-MyAccount-navigation .is-active a {
        background: none;
        color: var(--cb-blue);
        font-weight: 600;
    }
}

/* Coupon form and discount rows (cart page) ---------------------------------- */
.cb-coupon {
    display: flex;
    gap: 8px;
    margin: 12px 0 4px;
}

.cb-coupon input {
    flex: 1;
    min-width: 0;
    height: 44px;
    padding: 0 12px;
    border: 1px solid var(--ui-200);
    border-radius: 4px;
    font: inherit;
}

.cb-coupon__message:empty {
    display: none;
}

.cb-coupon__message.is-error {
    color: #c0392b;
}

.cb-cart-summary__row--discount strong {
    color: var(--cb-blue);
}

.cb-cart-summary__remove {
    margin-left: 6px;
    font-size: .85em;
}