/* Cocoa Luxury shop, workshop form and customer pages. */
.cl-commerce-page {
    background: var(--cl-cream, #f8f4f0);
}

.cl-commerce,
.cl-booking-slot {
    --cl-shop-surface: var(--cl-background, #fff);
    --cl-shop-ink: var(--cl-dark, #1c120d);
    --cl-shop-muted: #695950;
    --cl-shop-line: #e6d9d1;
    --cl-shop-line: color-mix(in srgb, var(--cl-shop-ink) 16%, var(--cl-shop-surface));
    --cl-shop-soft: var(--cl-cream, #f8f4f0);
    --cl-shop-highlight: #fbe9e0;
    --cl-shop-highlight: color-mix(in srgb, var(--cl-peach, #f8c7a7) 42%, var(--cl-shop-surface));
    --cl-shop-action: #a92227;
    --cl-shop-action: color-mix(in srgb, var(--cl-accent, #fc0404) 70%, var(--cl-shop-ink));
    --cl-shop-button: linear-gradient(155deg,
            color-mix(in srgb, var(--cl-button-top, #ff4e55) 78%, var(--cl-shop-ink)),
            color-mix(in srgb, var(--cl-button-bottom, #ff1420) 76%, var(--cl-shop-ink)));
    --cl-shop-radius: max(10px, min(var(--cl-radius, 20px), 22px));
    --cl-shop-gap: clamp(16px, 3vw, 36px);
    color: var(--cl-shop-ink);
    line-height: 1.55;
}

.cl-commerce {
    min-width: 0;
    padding-bottom: clamp(64px, 8vw, 112px);
}

.cl-commerce h1,
.cl-commerce h2,
.cl-commerce h3,
.cl-booking-slot .product_title {
    font-family: var(--cl-heading-font, Georgia, serif);
    color: var(--cl-shop-ink);
    line-height: 1.16;
}

.cl-commerce h1 {
    font-size: clamp(38px, 5vw, 64px);
    margin: 0 0 clamp(22px, 4vw, 42px);
}

.cl-commerce h2 {
    font-size: clamp(24px, 3vw, 36px);
    margin: 0 0 16px;
}

.cl-commerce h3 {
    font-size: clamp(21px, 2.5vw, 28px);
    margin: 0 0 15px;
}

.cl-commerce p+p {
    margin-top: .75em;
}

.cl-commerce .woocommerce-breadcrumb {
    margin: 0 0 24px;
    color: var(--cl-shop-muted);
    font-size: .85rem;
    overflow-wrap: anywhere;
}

.cl-commerce :is(.woocommerce, .woocommerce-MyAccount-content, .wc-block-components-main, .wc-block-components-sidebar),
.cl-booking-slot :is(.woocommerce, .product, .summary) {
    min-width: 0;
}

:is(.cl-commerce, .cl-booking-slot) :is(.woocommerce-Price-amount, .wc-block-components-formatted-money-amount) {
    font-variant-numeric: tabular-nums;
}

.cl-commerce :is(a:not([class]), .woocommerce-LostPassword a, .lost_password a, .woocommerce-terms-and-conditions-link) {
    color: var(--cl-shop-action);
    text-decoration: underline;
    text-underline-offset: .18em;
}

/* Primary controls. Gateway wallets retain their own appearance. */
:is(.cl-commerce, .cl-booking-slot) :is(a.button, button.button, input.button, input[type="submit"].submit,
    .single_add_to_cart_button, .wc-bookings-booking-form-button,
    .woocommerce-Button, .wp-block-button__link,
    .wc-block-components-button:not(.is-link):not(.is-tertiary)) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45em;
    min-height: 46px;
    padding: 12px 21px;
    border: 1px solid transparent;
    border-radius: 9px;
    background-color: var(--cl-shop-action);
    background-image: var(--cl-shop-button);
    color: #fff;
    font: 600 .9rem/1.35 var(--cl-body-font, Arial, sans-serif);
    letter-spacing: .015em;
    text-align: center;
    text-decoration: none;
    white-space: normal;
    box-shadow: 0 3px 10px #1c120d16;
    transition: filter .18s ease, box-shadow .18s ease;
}

:is(.cl-commerce, .cl-booking-slot) :is(a.button, button.button, input.button, .single_add_to_cart_button,
    .wc-bookings-booking-form-button, .woocommerce-Button, .wp-block-button__link,
    .wc-block-components-button:not(.is-link):not(.is-tertiary)):is(:hover, :active) {
    background-color: var(--cl-shop-action);
    background-image: var(--cl-shop-button);
    color: #fff;
    filter: brightness(.93);
}

:is(.cl-commerce, .cl-booking-slot) :is(a.button, button.button, input.button, .single_add_to_cart_button,
    .wc-bookings-booking-form-button, .woocommerce-Button, .wc-block-components-button):is(:disabled, .disabled, [aria-disabled="true"]) {
    opacity: .57;
    cursor: not-allowed;
    box-shadow: none;
}

:is(.cl-commerce, .cl-booking-slot) :is(a, button, input, select, textarea):focus-visible {
    outline: 2px solid var(--cl-shop-action);
    outline-offset: 3px;
}

.cl-commerce :is(button[name="update_cart"], .woocommerce-MyAccount-content a.button.view, .woocommerce-MyAccount-content a.button.edit) {
    background: var(--cl-shop-highlight);
    border-color: var(--cl-shop-line);
    color: var(--cl-shop-ink);
    box-shadow: none;
}

.cl-commerce :is(button[name="update_cart"], .woocommerce-MyAccount-content a.button.view, .woocommerce-MyAccount-content a.button.edit):hover {
    background: var(--cl-shop-ink);
    color: #fff;
}

/* Inputs, SelectWoo dropdowns, password forms, and payment fields. */
:is(.cl-commerce, .cl-booking-slot) :is(input.input-text, input[type="number"], .wc-bookings-booking-form input[type="text"],
    textarea, select) {
    min-width: 0;
    max-width: 100%;
    min-height: 46px;
    padding: 11px 13px;
    border: 1px solid var(--cl-shop-line);
    border-radius: 9px;
    background: var(--cl-shop-surface);
    color: var(--cl-shop-ink);
    font: 400 1rem/1.35 var(--cl-body-font, Arial, sans-serif);
    box-shadow: none;
}

.cl-commerce :is(input.input-text:not(.qty), textarea, .woocommerce form select),
.cl-booking-slot .wc-bookings-booking-form select {
    width: 100%;
}

.cl-commerce :is(input.input-text, textarea)::placeholder {
    color: var(--cl-shop-muted);
}

.cl-commerce textarea {
    min-height: 106px;
    resize: vertical;
}

.cl-commerce :is(input[type="checkbox"], input[type="radio"]) {
    accent-color: var(--cl-shop-action);
}

.cl-commerce .woocommerce form .form-row {
    margin-bottom: 13px;
    padding: 0;
}

.cl-commerce .woocommerce form .form-row label {
    margin-bottom: 5px;
    font-size: .88rem;
    font-weight: 600;
    line-height: 1.5;
}

.cl-commerce .woocommerce form .form-row.woocommerce-invalid :is(input.input-text, .select2-selection) {
    border-color: #a32628;
}

.cl-commerce .woocommerce form .form-row.woocommerce-validated :is(input.input-text, .select2-selection) {
    border-color: var(--cl-shop-line);
}

.cl-commerce .select2-container .select2-selection--single {
    min-height: 46px;
    border-color: var(--cl-shop-line);
    border-radius: 9px;
    background: var(--cl-shop-surface);
}

.cl-commerce .select2-container .select2-selection--single .select2-selection__rendered {
    padding-inline: 13px 32px;
    color: var(--cl-shop-ink);
    line-height: 44px;
}

.cl-commerce .select2-container .select2-selection--single .select2-selection__arrow {
    height: 44px;
    right: 8px;
}

.cl-commerce-page .select2-dropdown {
    border-color: #d8c6bc;
    border-radius: 8px;
    background: var(--cl-background, #fff);
    color: var(--cl-dark, #1c120d);
}

.cl-commerce-page .select2-container--default .select2-results__option--highlighted[aria-selected] {
    background: var(--cl-dark, #1c120d);
    color: #fff;
}

.cl-commerce .quantity .qty {
    width: 4.3em;
    padding-inline: 8px;
}

.cl-commerce :is(.woocommerce-privacy-policy-text, .woocommerce-password-hint, .woocommerce-password-strength) {
    font-size: .87rem;
}

.cl-commerce .woocommerce-password-strength {
    margin-top: 7px;
    padding: 8px 12px;
    border-radius: 7px;
}

/* Classic and block notices, including checkout gateway messages. */
:is(.cl-commerce, .cl-booking-slot) :is(.woocommerce-info, .woocommerce-message, .woocommerce-error, .wc-block-components-notice-banner) {
    --cl-notice-ink: #69472e;
    --cl-notice-bg: #fff2e6;
    margin: 0 0 18px;
    padding: 13px 16px;
    border: 1px solid color-mix(in srgb, var(--cl-notice-ink) 22%, var(--cl-notice-bg));
    border-inline-start: 3px solid var(--cl-notice-ink);
    border-radius: 9px;
    background: var(--cl-notice-bg);
    color: var(--cl-notice-ink);
    font-size: .9rem;
    line-height: 1.55;
    overflow-wrap: anywhere;
    list-style: none;
}

:is(.cl-commerce, .cl-booking-slot) :is(a.button, button.button, input.button, input[type="submit"].submit, .single_add_to_cart_button, .wc-bookings-booking-form-button, .woocommerce-Button, .wp-block-button__link, .wc-block-components-button:not(.is-link):not(.is-tertiary)):is(.cl-commerce, .cl-booking-slot) :is(.woocommerce-message, .wc-block-components-notice-banner.is-success) {
    --cl-notice-ink: #2c5c40;
    --cl-notice-bg: #edf6ef;
}

:is(.cl-commerce, .cl-booking-slot) :is(.woocommerce-error, .wc-block-components-notice-banner.is-error) {
    --cl-notice-ink: #8b292c;
    --cl-notice-bg: #fff0ee;
}

:is(.cl-commerce, .cl-booking-slot) :is(.woocommerce-info, .woocommerce-message, .woocommerce-error) {
    padding-inline-start: 44px;
}

:is(.cl-commerce, .cl-booking-slot) :is(.woocommerce-info, .woocommerce-message, .woocommerce-error)::before {
    inset-inline-start: 15px;
    top: 13px;
    color: var(--cl-notice-ink);
}

:is(.cl-commerce, .cl-booking-slot) :is(.woocommerce-info, .woocommerce-message, .woocommerce-error) li {
    padding: 0;
    margin: 0;
}

:is(.cl-commerce, .cl-booking-slot) :is(.woocommerce-info, .woocommerce-message, .woocommerce-error) li+li {
    margin-top: .35em;
}

:is(.cl-commerce, .cl-booking-slot) .wc-block-components-notice-banner>svg {
    background-color: var(--cl-notice-ink);
    fill: #fff;
    flex-shrink: 0;
}

:is(.cl-commerce, .cl-booking-slot) :is(.woocommerce-info, .woocommerce-message, .woocommerce-error) a:not(.button),
.cl-commerce .wc-block-components-notice-banner__content a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: .17em;
}

:is(.cl-commerce, .cl-booking-slot) :is(.woocommerce-message, .woocommerce-info)>a.button {
    min-height: 36px;
    margin-inline-start: 14px;
    padding: 7px 13px;
    font-size: .8rem;
}

/* Workshop product and the same form in the homepage booking panel. */
:is(.cl-commerce, .cl-booking-slot) div.cl-bookable-product>div.summary {
    width: 100%;
    float: none;
    margin: 0 0 30px;
    min-width: 0;
}

.cl-commerce .cl-bookable-product>.summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, .94fr);
    gap: clamp(30px, 6vw, 90px);
    align-items: start;
}

.cl-workshop-details {
    padding-block: clamp(12px, 4vw, 45px);
    min-width: 0;
    overflow-wrap: anywhere;
}

.cl-workshop-eyebrow {
    margin: 0 0 15px;
    color: var(--cl-shop-action);
    font-size: .79rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.cl-commerce .cl-workshop-details .product_title {
    margin: 0 0 18px;
    font-size: clamp(38px, 5.3vw, 70px);
    line-height: 1.02;
}

.cl-commerce .cl-bookable-product .cl-workshop-details .price {
    color: var(--cl-shop-action);
    font-size: clamp(20px, 2.5vw, 29px);
    font-weight: 600;
    margin: 0 0 15px;
}

.cl-commerce .cl-workshop-details .woocommerce-product-details__short-description {
    max-width: 50ch;
    color: var(--cl-shop-muted);
    line-height: 1.65;
}

.cl-workshop-booking {
    min-width: 0;
    padding: clamp(18px, 3vw, 36px);
    border: 1px solid var(--cl-shop-line);
    border-radius: var(--cl-shop-radius);
    background: var(--cl-shop-surface);
    box-shadow: 0 12px 32px #1c120d0c;
}

.cl-workshop-booking__title {
    margin-bottom: 20px;
}

:is(.cl-commerce, .cl-booking-slot) .cl-bookable-product form.cart {
    display: block;
    float: none;
    margin: 0;
}

.cl-booking-slot .cl-workshop-details,
.cl-booking-slot .cl-workshop-booking__title,
.cl-booking-slot .cl-bookable-product :is(.woocommerce-tabs, .related, .upsells) {
    display: none;
}

.cl-booking-slot .cl-bookable-product>.summary {
    margin-bottom: 0;
}

.cl-booking-slot .cl-workshop-booking {
    padding: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.cl-commerce .cl-bookable-product .woocommerce-tabs {
    margin-top: 32px;
}

.cl-commerce .cl-bookable-product .woocommerce-Tabs-panel {
    padding: clamp(18px, 3vw, 32px);
    border: 1px solid var(--cl-shop-line);
    border-radius: var(--cl-shop-radius);
    background: var(--cl-shop-surface);
}

.cl-commerce .cl-bookable-product .woocommerce-tabs ul.tabs {
    padding-inline: 0;
}

.cl-commerce div.cl-bookable-product .woocommerce-tabs ul.tabs li {
    border-color: var(--cl-shop-line);
    background: var(--cl-shop-highlight);
    margin-inline: 0;
    border-radius: 8px 8px 0 0;
}

.cl-commerce .cl-bookable-product .woocommerce-tabs ul.tabs li::before,
.cl-commerce .cl-bookable-product .woocommerce-tabs ul.tabs li::after {
    display: none;
}

:is(.cl-commerce, .cl-booking-slot) .wc-bookings-booking-form {
    padding: 0;
    margin: 0 0 16px;
    border: 0;
    color: var(--cl-shop-ink);
    font-size: .94rem;
}

:is(.cl-commerce, .cl-booking-slot) .wc-bookings-booking-form .form-field {
    margin: 0 0 14px;
    padding: 0;
}

:is(.cl-commerce, .cl-booking-slot) .wc-bookings-booking-form .form-field>label {
    display: block;
    margin: 0 0 6px;
    color: var(--cl-shop-ink);
    font-size: .87rem;
    font-weight: 600;
}

:is(.cl-commerce, .cl-booking-slot) .wc-bookings-booking-form fieldset {
    min-inline-size: 0;
}

:is(.cl-commerce, .cl-booking-slot) .wc-bookings-booking-form .wc-bookings-date-picker {
    padding: 0;
    border: 0;
}

:is(.cl-commerce, .cl-booking-slot) .wc-bookings-date-picker .ui-datepicker {
    width: 100%;
    max-width: 100%;
    padding: 0;
    border: 1px solid var(--cl-shop-line);
    border-radius: 13px;
    background: var(--cl-shop-surface);
    box-shadow: none;
}

:is(.cl-commerce, .cl-booking-slot) .wc-bookings-date-picker .ui-datepicker-header {
    padding-block: 8px;
    border: 0;
    border-radius: 12px 12px 0 0;
    background: var(--cl-shop-ink);
    color: #fff;
    text-shadow: none;
}

:is(.cl-commerce, .cl-booking-slot) .wc-bookings-date-picker .ui-datepicker-title {
    color: #fff;
    font-family: var(--cl-heading-font, Georgia, serif);
    font-size: clamp(16px, 2vw, 22px);
    font-weight: 600;
    line-height: 1.55;
    text-align: center;
}

:is(.cl-commerce, .cl-booking-slot) .wc-bookings-date-picker :is(.ui-datepicker-prev, .ui-datepicker-next) {
    background-color: transparent;
    border: 0;
    border-radius: 6px;
    cursor: pointer;
}

:is(.cl-commerce, .cl-booking-slot) .wc-bookings-date-picker :is(.ui-datepicker-prev, .ui-datepicker-next):hover {
    background-color: #ffffff25;
}

:is(.cl-commerce, .cl-booking-slot) .wc-bookings-date-picker .ui-datepicker-calendar {
    width: 100%;
    table-layout: fixed;
    margin: 0;
    border: 0;
    border-collapse: separate;
    border-spacing: 2px;
}

:is(.cl-commerce, .cl-booking-slot) .wc-bookings-date-picker .ui-datepicker-calendar th {
    padding: 7px 0 4px;
    border: 0;
    background: transparent;
    color: var(--cl-shop-muted);
    font: 600 .75rem/1.2 var(--cl-body-font, Arial, sans-serif);
    text-align: center;
}

/* Bookings uses important declarations on date and slot states. */
:is(.cl-commerce, .cl-booking-slot) #wc-bookings-booking-form .ui-datepicker-calendar td {
    padding: 1px;
    border: 0;
    background: transparent !important;
    text-align: center;
}

:is(.cl-commerce, .cl-booking-slot) #wc-bookings-booking-form .ui-datepicker-calendar td> :is(a, span) {
    display: grid;
    place-items: center;
    width: min(100%, 38px);
    min-height: 32px;
    aspect-ratio: 1;
    padding: 0;
    margin: 0 auto;
    border: 1px solid transparent;
    border-radius: 50%;
    box-shadow: none;
    background: transparent !important;
    color: var(--cl-shop-muted) !important;
    font: 600 .79rem/1.2 var(--cl-body-font, Arial, sans-serif);
    text-shadow: none;
    text-decoration: none;
}

:is(.cl-commerce, .cl-booking-slot) #wc-bookings-booking-form .ui-datepicker-calendar td.bookable>a {
    background: var(--cl-shop-highlight) !important;
    color: var(--cl-shop-action) !important;
}

:is(.cl-commerce, .cl-booking-slot) #wc-bookings-booking-form .ui-datepicker-calendar td.partially_booked.bookable>a {
    border-color: var(--cl-shop-action);
}

:is(.cl-commerce, .cl-booking-slot) #wc-bookings-booking-form .ui-datepicker-calendar td.ui-datepicker-today>a {
    border-color: var(--cl-shop-action);
}

:is(.cl-commerce, .cl-booking-slot) #wc-bookings-booking-form .ui-datepicker-calendar td.bookable>a:is(:hover, .ui-state-active),
:is(.cl-commerce, .cl-booking-slot) #wc-bookings-booking-form .ui-datepicker-calendar td.ui-datepicker-current-day>a {
    background: var(--cl-shop-action) !important;
    color: #fff !important;
}

:is(.cl-commerce, .cl-booking-slot) #wc-bookings-booking-form .ui-datepicker-calendar td:is(.ui-state-disabled, .fully_booked, .not_bookable) {
    opacity: .6;
}

:is(.cl-commerce, .cl-booking-slot) #wc-bookings-booking-form .ui-datepicker-calendar td.fully_booked> :is(a, span) {
    text-decoration: line-through;
}

:is(.cl-commerce, .cl-booking-slot) #wc-bookings-booking-form .block-picker {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 12px 0;
    padding: 0;
    list-style: none;
}

:is(.cl-commerce, .cl-booking-slot) #wc-bookings-booking-form .block-picker li {
    float: none;
    margin: 0;
    padding: 0;
    min-width: 0;
}

:is(.cl-commerce, .cl-booking-slot) #wc-bookings-booking-form .block-picker li a {
    display: block;
    padding: 7px 10px;
    border: 1px solid var(--cl-shop-line);
    border-radius: 8px;
    box-shadow: none;
    background: var(--cl-shop-soft) !important;
    color: var(--cl-shop-ink) !important;
    font-size: .85rem;
    text-decoration: none;
}

:is(.cl-commerce, .cl-booking-slot) #wc-bookings-booking-form .block-picker li a:is(:hover, .selected) {
    background: var(--cl-shop-ink) !important;
    color: #fff !important;
}

:is(.cl-commerce, .cl-booking-slot) .wc-bookings-booking-form .wc-bookings-booking-cost {
    margin: 14px 0 0;
    padding: 12px 14px;
    border: 1px solid var(--cl-shop-line);
    border-radius: 9px;
    background: var(--cl-shop-highlight);
    color: var(--cl-shop-ink);
    font-weight: 600;
}

:is(.cl-commerce, .cl-booking-slot) .cl-bookable-product .single_add_to_cart_button,
:is(.cl-commerce, .cl-booking-slot) .wc-bookings-booking-form-button {
    width: 100%;
    float: none;
}

/* Shared order surfaces and classic WooCommerce tables. */
.cl-commerce :is(.cart_totals, .woocommerce-customer-details, .woocommerce-order-details,
    .woocommerce-EditAccountForm, .woocommerce-address-fields,
    .woocommerce-form-login, .woocommerce-form-register, .woocommerce-ResetPassword,
    .woocommerce-order-pay #order_review) {
    margin-bottom: var(--cl-shop-gap);
    padding: clamp(16px, 3vw, 30px);
    border: 1px solid var(--cl-shop-line);
    border-radius: var(--cl-shop-radius);
    background: var(--cl-shop-surface);
}

.cl-commerce .woocommerce table.shop_table {
    width: 100%;
    margin: 0 0 20px;
    border: 1px solid var(--cl-shop-line);
    border-radius: 12px;
    border-spacing: 0;
    background: var(--cl-shop-surface);
    color: var(--cl-shop-ink);
    font-size: .91rem;
    overflow-wrap: anywhere;
}

.cl-commerce .woocommerce table.shop_table :is(th, td) {
    padding: 12px 14px;
    border-color: var(--cl-shop-line);
    vertical-align: middle;
}

.cl-commerce .woocommerce table.shop_table thead th {
    background: var(--cl-shop-highlight);
    font-weight: 600;
}

.cl-commerce .woocommerce table.shop_table thead th:first-child {
    border-top-left-radius: 11px;
}

.cl-commerce .woocommerce table.shop_table thead th:last-child {
    border-top-right-radius: 11px;
}

.cl-commerce .woocommerce table.shop_table tr:first-child td {
    border-top-color: var(--cl-shop-line);
}

.cl-commerce .woocommerce table.shop_table td.product-name a,
.cl-commerce .woocommerce table.shop_table td.woocommerce-orders-table__cell-order-number a {
    font-weight: 600;
}

.cl-commerce .woocommerce .shop_table .product-thumbnail img {
    width: 64px;
    height: 64px;
    max-width: none;
    border-radius: 7px;
    object-fit: cover;
}

.cl-commerce .woocommerce a.remove {
    width: 30px;
    height: 30px;
    color: var(--cl-shop-action) !important;
    background: var(--cl-shop-highlight);
    line-height: 30px;
    font-size: 20px;
}

.cl-commerce .woocommerce a.remove:hover {
    color: #fff !important;
    background: var(--cl-shop-action);
}

.cl-commerce .woocommerce .shop_table dl.variation {
    margin: 6px 0 0;
    color: var(--cl-shop-muted);
    font-size: .83rem;
}

.cl-commerce .woocommerce .shop_table dl.variation :is(dt, dd) {
    margin: 0 0 4px;
    overflow-wrap: anywhere;
}

.cl-commerce .woocommerce table.cart td.actions .coupon input.input-text {
    width: min(100%, 180px);
    margin: 0 8px 0 0;
}

.cl-commerce .woocommerce .wc-proceed-to-checkout {
    padding: 6px 0 0;
}

.cl-commerce .woocommerce .wc-proceed-to-checkout .checkout-button {
    width: 100%;
    margin: 0;
}

.cl-commerce .woocommerce .cart_totals .shop_table {
    margin-bottom: 13px;
    border: 0;
}

.cl-commerce .woocommerce .cart_totals .shop_table th {
    padding-inline-start: 0;
}

.cl-commerce .woocommerce .cart_totals .shop_table td {
    padding-inline-end: 0;
    text-align: end;
}

.cl-commerce .woocommerce .cart_totals .order-total,
.cl-commerce .woocommerce .woocommerce-checkout-review-order-table .order-total {
    color: var(--cl-shop-ink);
    font-size: 1.12rem;
}

/* Classic cart and checkout. Preserve the native form and gateway controls. */
.cl-commerce form.woocommerce-checkout #customer_details,
.cl-commerce form.woocommerce-checkout #order_review {
    min-width: 0;
    padding: clamp(16px, 3vw, 28px);
    border: 1px solid var(--cl-shop-line);
    border-radius: var(--cl-shop-radius);
    background: var(--cl-shop-surface);
}

.cl-commerce form.woocommerce-checkout #customer_details {
    margin-bottom: var(--cl-shop-gap);
}

.cl-commerce form.woocommerce-checkout #customer_details> :is(.col-1, .col-2) {
    width: 100%;
    float: none;
}

.cl-commerce .woocommerce form:is(.checkout_coupon, .woocommerce-form-login) {
    border-color: var(--cl-shop-line);
    border-radius: var(--cl-shop-radius);
    background: var(--cl-shop-surface);
}

.cl-commerce .woocommerce :is(#payment, #add_payment_method #payment) {
    background: var(--cl-shop-soft);
    border: 1px solid var(--cl-shop-line);
    border-radius: 12px;
}

.cl-commerce .woocommerce #payment ul.payment_methods {
    margin: 0;
    padding: 14px 16px;
    border-bottom: 1px solid var(--cl-shop-line);
    list-style: none;
}

.cl-commerce .woocommerce #payment ul.payment_methods li {
    margin: 0 0 5px;
    line-height: 1.6;
}

.cl-commerce .woocommerce #payment ul.payment_methods li label {
    font-weight: 600;
}

.cl-commerce .woocommerce #payment ul.payment_methods img {
    display: inline-block;
    max-height: 28px;
    width: auto;
    vertical-align: middle;
}

.cl-commerce .woocommerce #payment div.payment_box {
    margin: 10px 0;
    padding: 13px;
    border: 1px solid var(--cl-shop-line);
    border-radius: 9px;
    background: var(--cl-shop-surface);
    color: var(--cl-shop-ink);
    font-size: .89rem;
    line-height: 1.55;
}

.cl-commerce .woocommerce #payment div.payment_box::before {
    display: none;
}

.cl-commerce .woocommerce #payment div.form-row {
    margin: 0;
    padding: 14px 16px;
}

.cl-commerce .woocommerce #payment #place_order {
    width: 100%;
    float: none;
    margin: 8px 0 0;
}

.cl-commerce .woocommerce :is(.wc-payment-form, #payment fieldset) {
    min-inline-size: 0;
    max-width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
}

.cl-commerce :is(.wc-stripe-elements-field, .wc-stripe-iban-element-field, .wc-square-credit-card-hosted-field) {
    max-width: 100%;
    padding: 12px;
    border: 1px solid var(--cl-shop-line);
    border-radius: 8px;
    background: var(--cl-shop-surface);
}

/* WooCommerce Cart and Checkout blocks. */
.cl-commerce :is(.wp-block-woocommerce-cart, .wp-block-woocommerce-checkout, .wc-block-order-confirmation) {
    color: var(--cl-shop-ink);
    font-family: var(--cl-body-font, Arial, sans-serif);
}

.cl-commerce :is(.wc-block-cart__main, .wc-block-checkout__main, .wc-block-cart__sidebar, .wc-block-checkout__sidebar) {
    min-width: 0;
}

.cl-commerce :is(.wc-block-components-totals-wrapper, .wc-block-components-order-summary, .wc-block-cart-items, .wc-block-checkout__terms) {
    border-color: var(--cl-shop-line);
}

.cl-commerce :is(.wp-block-woocommerce-cart-totals-block, .wp-block-woocommerce-checkout-order-summary-block) {
    padding: clamp(14px, 2.4vw, 23px);
    border: 1px solid var(--cl-shop-line);
    border-radius: var(--cl-shop-radius);
    background: var(--cl-shop-surface);
}

.cl-commerce :is(.wc-block-components-title, .wc-block-components-checkout-step__title) {
    color: var(--cl-shop-ink);
    font-family: var(--cl-heading-font, Georgia, serif);
    line-height: 1.25;
}

.cl-commerce :is(.wc-block-components-totals-footer-item, .wc-block-components-product-name) {
    color: var(--cl-shop-ink);
    font-weight: 600;
}

.cl-commerce .wc-block-components-order-summary-item__quantity {
    background: var(--cl-shop-highlight);
    border-color: var(--cl-shop-line);
    color: var(--cl-shop-ink);
    box-shadow: 0 0 0 2px var(--cl-shop-surface);
}

.cl-commerce .wc-block-components-order-summary-item__image img,
.cl-commerce .wc-block-cart-item__image img {
    border-radius: 8px;
}

.cl-commerce .wc-block-components-quantity-selector {
    border-color: var(--cl-shop-line);
    border-radius: 8px;
    background: var(--cl-shop-surface);
}

.cl-commerce .wc-block-components-quantity-selector input {
    min-height: 0;
    padding: 0;
    border: 0;
    background: transparent;
    font: inherit;
}

.cl-commerce :is(.wc-block-components-text-input, .wc-block-components-combobox) input,
.cl-commerce :is(.wc-blocks-components-select__select, .wc-block-components-textarea) {
    border-color: var(--cl-shop-line);
    border-radius: 8px;
    background: var(--cl-shop-surface);
    color: var(--cl-shop-ink);
    box-shadow: none;
}

/* Float labels and payment widgets use their native dimensions. */
.cl-commerce .wc-block-components-text-input label {
    color: var(--cl-shop-muted);
}

.cl-commerce .wc-block-components-radio-control-accordion-option {
    border-color: var(--cl-shop-line);
}

.cl-commerce .wc-block-components-radio-control-accordion-option--checked-option-highlighted {
    border-radius: 10px;
    box-shadow: inset 0 0 0 1px var(--cl-shop-action);
    background: var(--cl-shop-surface);
}

.cl-commerce .wc-block-cart__submit-container {
    background: var(--cl-shop-soft);
    color: var(--cl-shop-line);
}

.cl-commerce :is(.wc-block-components-checkout-place-order-button, .wc-block-cart__submit-button) {
    width: 100%;
}

.cl-commerce .wc-block-components-validation-error {
    color: #9d2429;
}

/* Account, address and payment method endpoints. */
.cl-commerce .woocommerce-MyAccount-navigation {
    width: auto;
    float: none;
    margin: 0 0 var(--cl-shop-gap);
}

.cl-commerce .woocommerce-MyAccount-navigation ul {
    display: grid;
    gap: 3px;
    padding: 7px;
    margin: 0;
    border: 1px solid var(--cl-shop-line);
    border-radius: var(--cl-shop-radius);
    background: var(--cl-shop-surface);
    list-style: none;
}

.cl-commerce .woocommerce-MyAccount-navigation li>a {
    display: block;
    padding: 11px 13px;
    border-radius: 8px;
    color: var(--cl-shop-ink);
    font-size: .88rem;
    font-weight: 500;
}

.cl-commerce .woocommerce-MyAccount-navigation li:is(.is-active, :hover)>a {
    background: var(--cl-shop-highlight);
    color: var(--cl-shop-action);
}

.cl-commerce .woocommerce-MyAccount-navigation li.is-active>a {
    font-weight: 700;
}

.cl-commerce .woocommerce-MyAccount-content {
    width: auto;
    float: none;
    min-width: 0;
    padding: clamp(16px, 3vw, 30px);
    border: 1px solid var(--cl-shop-line);
    border-radius: var(--cl-shop-radius);
    background: var(--cl-shop-surface);
    overflow-wrap: anywhere;
}

.cl-commerce .woocommerce-MyAccount-content fieldset {
    min-inline-size: 0;
    margin: 22px 0;
    padding: 14px;
    border: 1px solid var(--cl-shop-line);
    border-radius: 9px;
}

.cl-commerce .woocommerce-MyAccount-content fieldset legend {
    padding-inline: 6px;
    color: var(--cl-shop-ink);
    font-family: var(--cl-heading-font, Georgia, serif);
    font-size: 1.2rem;
    font-weight: 600;
}

.cl-commerce :is(.woocommerce-Address, .woocommerce-order-overview, .wc-block-order-confirmation-status) {
    padding: clamp(14px, 2.5vw, 23px);
    border: 1px solid var(--cl-shop-line);
    border-radius: 12px;
    background: var(--cl-shop-soft);
}

.cl-commerce .woocommerce-Address :is(h2, h3) {
    font-size: clamp(19px, 2vw, 25px);
}

.cl-commerce .woocommerce-Address address,
.cl-commerce .woocommerce-customer-details address {
    font-style: normal;
    line-height: 1.6;
}

.cl-commerce .woocommerce-customer-details address {
    border: 1px solid var(--cl-shop-line);
    border-radius: 9px;
    background: var(--cl-shop-soft);
    padding: 14px;
}

.cl-commerce .woocommerce-EditAccountForm,
.cl-commerce .woocommerce-address-fields {
    margin: 0;
    padding: 0;
    border: 0;
}

.cl-commerce .woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-actions .button {
    min-height: 35px;
    margin: 2px;
    padding: 7px 11px;
    font-size: .78rem;
}

.cl-commerce .woocommerce-order-overview {
    display: flex;
    flex-wrap: wrap;
    gap: 14px 18px;
    margin: 18px 0 var(--cl-shop-gap);
}

.cl-commerce .woocommerce-order-overview li {
    float: none;
    margin: 0;
    padding: 0 16px 0 0;
    border-color: var(--cl-shop-line);
    color: var(--cl-shop-muted);
}

.cl-commerce .woocommerce-order-overview li strong {
    margin-top: 4px;
    color: var(--cl-shop-ink);
    font-size: .91rem;
}

.cl-commerce .woocommerce-thankyou-order-received {
    color: var(--cl-shop-ink);
    font: 600 clamp(21px, 3vw, 30px)/1.25 var(--cl-heading-font, Georgia, serif);
}

.cl-commerce ul.products li.product {
    padding: clamp(12px, 2.5vw, 21px);
    border: 1px solid var(--cl-shop-line);
    border-radius: var(--cl-shop-radius);
    background: var(--cl-shop-surface);
}

.cl-commerce ul.products li.product .woocommerce-loop-product__title {
    font-size: clamp(18px, 2.5vw, 26px);
}

.cl-commerce ul.products li.product .price {
    color: var(--cl-shop-action);
    font-weight: 600;
}

.cl-commerce ul.products li.product a img {
    border-radius: 9px;
}

:is(.cl-commerce, .cl-booking-slot) :is(a.button, button.button, input.button, input[type="submit"].submit, .single_add_to_cart_button, .wc-bookings-booking-form-button, .woocommerce-Button, .wp-block-button__link, .wc-block-components-button:not(.is-link):not(.is-tertiary)) {
    margin-top: 15px;
}

.wc-blocks-components-select .wc-blocks-components-select__label{
    left: 15px;
    top: 4px;
    font-size: 9px;
}

@media (min-width: 940px) {

    .cl-commerce .woocommerce:has(> .woocommerce-cart-form),
    .cl-commerce .woocommerce:has(> .woocommerce-MyAccount-navigation),
    .cl-commerce form.woocommerce-checkout:has(> #customer_details):has(> #order_review) {
        display: grid;
        align-items: start;
        gap: var(--cl-shop-gap);
    }

    .cl-commerce .woocommerce:has(> .woocommerce-cart-form, > .woocommerce-MyAccount-navigation)::before,
    .cl-commerce .woocommerce:has(> .woocommerce-cart-form, > .woocommerce-MyAccount-navigation)::after {
        display: none;
    }

    .cl-commerce .woocommerce:has(> .woocommerce-cart-form) {
        grid-template-columns: minmax(0, 1.55fr) minmax(290px, 1fr);
    }

    .cl-commerce .woocommerce:has(> .woocommerce-cart-form)>* {
        grid-column: 1 / -1;
    }

    .cl-commerce .woocommerce:has(> .woocommerce-cart-form)>.woocommerce-notices-wrapper:empty {
        display: none;
    }

    .cl-commerce .woocommerce:has(> .woocommerce-cart-form)>.woocommerce-cart-form {
        grid-column: 1;
    }

    .cl-commerce .woocommerce:has(> .woocommerce-cart-form)>.cart-collaterals {
        grid-column: 2;
    }

    .cl-commerce .woocommerce .cart-collaterals .cart_totals {
        width: 100%;
        float: none;
    }

    .cl-commerce .woocommerce:has(> .woocommerce-MyAccount-navigation) {
        grid-template-columns: minmax(180px, 225px) minmax(0, 1fr);
    }

    .cl-commerce .woocommerce:has(> .woocommerce-MyAccount-navigation)>* {
        grid-column: 1 / -1;
    }

    .cl-commerce .woocommerce:has(> .woocommerce-MyAccount-navigation)>.woocommerce-MyAccount-navigation {
        grid-column: 1;
        margin: 0;
    }

    .cl-commerce .woocommerce:has(> .woocommerce-MyAccount-navigation)>.woocommerce-MyAccount-content {
        grid-column: 2;
    }

    .cl-commerce form.woocommerce-checkout:has(> #customer_details):has(> #order_review) {
        grid-template-columns: minmax(0, 1.2fr) minmax(300px, 1fr);
        grid-template-rows: min-content 1fr;
        column-gap: var(--cl-shop-gap);
        row-gap: 13px;
    }

    .cl-commerce form.woocommerce-checkout>* {
        grid-column: 1 / -1;
    }

    .cl-commerce form.woocommerce-checkout>#customer_details {
        grid-column: 1;
        grid-row: 1 / span 2;
        margin: 0;
    }

    .cl-commerce form.woocommerce-checkout>#order_review_heading {
        grid-column: 2;
        grid-row: 1;
        margin: 0;
    }

    .cl-commerce form.woocommerce-checkout>#order_review {
        grid-column: 2;
        grid-row: 2;
    }
}

@media (max-width: 767px) {
    .cl-commerce .cl-bookable-product>.summary {
        grid-template-columns: minmax(0, 1fr);
        gap: 18px;
    }

    .cl-commerce .cl-workshop-details {
        padding-block: 0 4px;
    }

    .cl-commerce .woocommerce :is(.cart-collaterals .cart_totals, form .form-row-first, form .form-row-last) {
        width: 100%;
        float: none;
    }

    .cl-commerce .woocommerce .shop_table .coupon {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
        width: 100%;
        margin-bottom: 9px;
    }

    .cl-commerce .woocommerce table.cart td.actions .coupon :is(input.input-text, button.button) {
        width: auto;
        flex: 1 1 110px;
        margin: 0;
    }

    .cl-commerce .woocommerce table.shop_table :is(th, td) {
        padding: 9px 10px;
    }

    .cl-commerce .woocommerce-MyAccount-navigation ul {
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
    }

    .cl-commerce .woocommerce-MyAccount-navigation li>a {
        padding: 9px 10px;
    }

    .cl-commerce .woocommerce-MyAccount-content {
        overflow-x: auto;
    }

    .cl-commerce .woocommerce .woocommerce-order-overview li {
        flex: 1 1 125px;
        border: 0;
    }

    :is(.cl-commerce, .cl-booking-slot) :is(.woocommerce-message, .woocommerce-info)>a.button {
        float: none;
        margin: 0 0 7px;
    }
}

@media (prefers-reduced-motion: reduce) {
    :is(.cl-commerce, .cl-booking-slot) :is(a, button, input, select, textarea) {
        transition: none;
    }
}