/*
 * Quick Launch Intake 0.5.5: the basket, checkout, order received and My account pages in the shop's
 * look (the same family as the website product: warm off-white, white cards, the Studio's green).
 * Only on those pages (body.qli-store). WooCommerce's block cart, checkout and order confirmation
 * (Twenty Twenty-Five and other block themes) and the classic pages.
 */

.qli-store {
  --qli-accent: #2f5d3a;
  --qli-accent-hover: #244a2e;
  --qli-accent-soft: #e7efe8;
  --qli-ink: #15181d;
  --qli-muted: #5c6370;
  --qli-line: #e3e6ea;
  --qli-radius: 16px;
  --qli-shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 8px 24px -12px rgba(16, 24, 40, .14);
  background-color: #faf8f4;
}

/* Page title. */
.qli-store .wp-block-post-title,
.qli-store h1.entry-title,
.qli-store .wc-block-order-confirmation-status h1 {
  font-weight: 650;
  letter-spacing: -.025em;
  color: var(--qli-ink);
}

/* ---------- Cards ---------- */
.qli-store .wc-block-cart-items,
.qli-store .wc-block-components-sidebar .wc-block-components-totals-wrapper:first-child,
.qli-store .wp-block-woocommerce-cart-totals-block,
.qli-store .wp-block-woocommerce-checkout-order-summary-block,
.qli-store .wc-block-components-checkout-step,
.qli-store .wc-block-order-confirmation-totals table,
.qli-store .wc-block-order-confirmation-billing-address address,
.qli-store .wc-block-order-confirmation-shipping-address address,
.qli-store .woocommerce-cart-form,
.qli-store .cart_totals,
.qli-store #order_review,
.qli-store form.checkout .col2-set,
.qli-store .woocommerce-order-details,
.qli-store .woocommerce-customer-details address,
.qli-store .woocommerce-MyAccount-content {
  box-sizing: border-box;
  border: 1px solid var(--qli-line) !important;
  border-radius: var(--qli-radius) !important;
  background: #fff;
  box-shadow: var(--qli-shadow);
}
.qli-store .wc-block-components-checkout-step { padding: 22px 24px !important; margin-bottom: 18px !important; }
.qli-store .wc-block-components-checkout-step::after { display: none !important; }
.qli-store .wp-block-woocommerce-cart-totals-block,
.qli-store .wp-block-woocommerce-checkout-order-summary-block { padding: 6px 4px; }
.qli-store .woocommerce-cart-form,
.qli-store .cart_totals,
.qli-store #order_review,
.qli-store form.checkout .col2-set,
.qli-store .woocommerce-order-details,
.qli-store .woocommerce-MyAccount-content { padding: 20px 24px; }
.qli-store .wc-block-order-confirmation-billing-address address,
.qli-store .wc-block-order-confirmation-shipping-address address,
.qli-store .woocommerce-customer-details address { padding: 18px 22px !important; font-style: normal; line-height: 1.6; }

/* Tables inside cards: no outer borders, soft row lines. */
.qli-store .wc-block-order-confirmation-totals table { border-collapse: separate !important; border-spacing: 0; overflow: hidden; width: 100%; margin: 0; }
.qli-store .woocommerce-table--order-details,
.qli-store .shop_table {
  border: 0 !important;
  border-collapse: collapse;
  width: 100%;
  margin: 0;
}
.qli-store .wc-block-order-confirmation-totals th:first-child,
.qli-store .wc-block-order-confirmation-totals td:first-child,
.qli-store .woocommerce-table--order-details th:first-child,
.qli-store .woocommerce-table--order-details td:first-child { text-align: left !important; }
.qli-store .wc-block-order-confirmation-totals a,
.qli-store .woocommerce-table--order-details a { color: var(--qli-ink); font-weight: 650; text-decoration: none; }
.qli-store .wc-block-order-confirmation-totals a:hover,
.qli-store .woocommerce-table--order-details a:hover { color: var(--qli-accent); text-decoration: underline; }
.qli-store .wc-block-order-confirmation-totals th,
.qli-store .wc-block-order-confirmation-totals td,
.qli-store .woocommerce-table--order-details th,
.qli-store .woocommerce-table--order-details td,
.qli-store .shop_table th,
.qli-store .shop_table td {
  border: 0 !important;
  border-top: 1px solid var(--qli-line) !important;
  padding: 14px 18px !important;
}
.qli-store .wc-block-order-confirmation-totals thead th,
.qli-store .woocommerce-table--order-details thead th,
.qli-store .shop_table thead th { border-top: 0 !important; font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; color: var(--qli-muted); font-weight: 650; }
.qli-store .wc-block-order-confirmation-totals tfoot th,
.qli-store .wc-block-order-confirmation-totals tfoot td,
.qli-store .woocommerce-table--order-details tfoot th,
.qli-store .woocommerce-table--order-details tfoot td { font-weight: 700; color: var(--qli-ink); background: #f7f8f5; }
.qli-store .wc-block-order-confirmation-totals .wc-item-meta,
.qli-store .woocommerce-table--order-details .wc-item-meta,
.qli-store .wc-block-components-product-details { margin: 6px 0 0 !important; padding: 0 !important; list-style: none; font-size: .9rem; color: var(--qli-muted); }
.qli-store .wc-item-meta li,
.qli-store .wc-block-components-product-details li { display: inline-flex; gap: 4px; margin: 0 6px 4px 0; padding: 2px 10px; border-radius: 999px; background: var(--qli-accent-soft); color: var(--qli-accent); font-size: .82rem; font-weight: 600; }
.qli-store .wc-item-meta li p,
.qli-store .wc-item-meta li strong,
.qli-store .wc-block-components-product-details li span { margin: 0 !important; font-weight: inherit; color: inherit; }
.qli-store .wc-block-components-product-details__name,
.qli-store .wc-item-meta-label { font-weight: 700 !important; }

/* Section headings. */
.qli-store .wc-block-order-confirmation-totals-wrapper h2,
.qli-store .wc-block-order-confirmation-billing-wrapper h2,
.qli-store .wc-block-order-confirmation-additional-information h2,
.qli-store .woocommerce-order-details__title,
.qli-store .woocommerce-column__title,
.qli-store .wc-block-components-checkout-step__title,
.qli-store .wc-block-components-title,
.qli-store .cart_totals h2 { font-weight: 650 !important; letter-spacing: -.015em; color: var(--qli-ink); }

/* ---------- Order received: the summary as tiles ---------- */
.qli-store .wc-block-order-confirmation-status p { font-size: 1.15rem; color: var(--qli-muted); }
.qli-store .wc-block-order-confirmation-summary-list,
.qli-store ul.woocommerce-order-overview {
  display: flex !important;
  flex-wrap: wrap;
  gap: 12px;
  margin: 8px 0 28px !important;
  padding: 0 !important;
  list-style: none;
}
.qli-store .wc-block-order-confirmation-summary-list-item,
.qli-store ul.woocommerce-order-overview li {
  display: flex !important;
  flex-direction: column;
  flex: 1 1 auto;
  min-width: 140px;
  gap: 4px;
  margin: 0 !important;
  padding: 14px 16px !important;
  border: 1px solid var(--qli-line) !important;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .05);
  font-size: .8rem !important;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--qli-muted);
  overflow-wrap: break-word;
}
.qli-store .wc-block-order-confirmation-summary-list-item__key { font-weight: 650; }
.qli-store .wc-block-order-confirmation-summary-list-item__value,
.qli-store ul.woocommerce-order-overview li strong { font-size: 1.02rem; font-weight: 650; text-transform: none; letter-spacing: 0; color: var(--qli-ink); }

/* "Your website" on the order: a sage card with the green button. */
.qli-store .qli-order-sites {
  position: relative;
  margin: 28px 0;
  padding: 26px 28px 22px;
  border: 1px solid rgba(47, 93, 58, .16);
  border-left: 5px solid var(--qli-accent);
  border-radius: var(--qli-radius);
  background:
    radial-gradient(rgba(47, 93, 58, .07) 1px, transparent 1.4px) 0 0 / 20px 20px,
    linear-gradient(180deg, #eef3ec, #e6ede4);
  box-shadow: var(--qli-shadow);
}
.qli-store .qli-order-sites h2 { margin: 0 0 6px; font-size: 1.5rem; font-weight: 650; letter-spacing: -.02em; color: var(--qli-ink); }
.qli-store .qli-order-sites p { margin: 0 0 12px; color: var(--qli-ink); line-height: 1.55; }
.qli-store .qli-order-sites-open { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.qli-store .qli-order-sites-name { font-weight: 650; }
.qli-store .qli-order-sites-note { margin-bottom: 0 !important; font-size: .9rem; color: var(--qli-muted) !important; }

/* ---------- Fields ---------- */
.qli-store .wc-block-components-text-input input,
.qli-store .wc-block-components-textarea,
.qli-store .wc-blocks-components-select__select,
.qli-store .wc-block-components-combobox .components-combobox-control__input,
.qli-store form.checkout input.input-text,
.qli-store form.checkout select,
.qli-store form.checkout textarea,
.qli-store .woocommerce-MyAccount-content input.input-text {
  border: 1.5px solid #cfd4da !important;
  border-radius: 12px !important;
  background-color: #fff !important;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
  transition: border-color .15s, box-shadow .15s;
}
.qli-store .wc-block-components-text-input input:focus,
.qli-store .wc-block-components-textarea:focus,
.qli-store .wc-blocks-components-select__select:focus,
.qli-store form.checkout input.input-text:focus,
.qli-store form.checkout select:focus,
.qli-store form.checkout textarea:focus {
  outline: none !important;
  border-color: var(--qli-accent) !important;
  box-shadow: 0 0 0 4px rgba(47, 93, 58, .16) !important;
}
.qli-store .wc-block-components-text-input.is-active label,
.qli-store .wc-block-components-text-input label { color: var(--qli-muted); }

/* Payment choices: a soft card each, the chosen one in green. */
.qli-store .wc-block-components-radio-control__option,
.qli-store .wc-block-components-radio-control-accordion-option {
  border-radius: 12px !important;
}
.qli-store .wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control-accordion-option--checked-option-highlighted,
.qli-store .wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control__option-checked {
  box-shadow: inset 0 0 0 2px var(--qli-accent) !important;
}
.qli-store .wc-block-components-radio-control__input:checked,
.qli-store input[type=radio]:checked,
.qli-store input[type=checkbox]:checked { accent-color: var(--qli-accent); }
.qli-store .wc-block-components-radio-control__input:checked { border-color: var(--qli-accent) !important; }
.qli-store .wc-block-components-radio-control__input:checked::before { background: var(--qli-accent) !important; }

/* ---------- Buttons ---------- */
.qli-store .wc-block-cart__submit-button,
.qli-store .wc-block-components-checkout-place-order-button,
.qli-store .wc-block-components-button.contained,
.qli-store a.checkout-button,
.qli-store #place_order,
.qli-store .qli-order-open,
.qli-store .woocommerce-MyAccount-content .button,
.qli-store .woocommerce-orders-table .button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 12px 24px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: var(--qli-accent) !important;
  color: #fff !important;
  font-weight: 650 !important;
  font-size: 1rem !important;
  text-decoration: none !important;
  box-shadow: 0 6px 16px -8px rgba(47, 93, 58, .7);
  transition: background-color .15s, transform .15s;
}
.qli-store .wc-block-cart__submit-button:hover,
.qli-store .wc-block-components-checkout-place-order-button:hover,
.qli-store .wc-block-components-button.contained:hover,
.qli-store a.checkout-button:hover,
.qli-store #place_order:hover,
.qli-store .qli-order-open:hover,
.qli-store .woocommerce-MyAccount-content .button:hover,
.qli-store .woocommerce-orders-table .button:hover { background: var(--qli-accent-hover) !important; transform: translateY(-1px); }
.qli-store .wc-block-cart__submit-button,
.qli-store .wc-block-components-checkout-place-order-button,
.qli-store a.checkout-button,
.qli-store #place_order { width: 100%; }
.qli-store .wc-block-components-checkout-return-to-cart-button,
.qli-store .wc-block-components-totals-coupon-link { color: var(--qli-accent) !important; font-weight: 600; }
.qli-store .wc-block-components-button:focus-visible,
.qli-store .qli-order-open:focus-visible { outline: none !important; box-shadow: 0 0 0 4px rgba(47, 93, 58, .28) !important; }

/* ---------- Basket: the website line ---------- */
.qli-store .wc-block-cart-items { overflow: hidden; }
.qli-store .wc-block-cart-items th { padding: 14px 18px !important; font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; color: var(--qli-muted); }
.qli-store .wc-block-cart-items td { padding: 18px !important; border-top: 1px solid var(--qli-line) !important; }
.qli-store .wc-block-cart-item__image img { border-radius: 12px; }
.qli-store .wc-block-components-product-name { font-weight: 650; color: var(--qli-ink) !important; text-decoration: none; }
.qli-store .wc-block-components-totals-item__label,
.qli-store .wc-block-components-totals-item__value { color: var(--qli-ink); }
.qli-store .wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.qli-store .wc-block-components-totals-footer-item .wc-block-components-totals-item__label { font-weight: 700; font-size: 1.15rem; }

/* My account: the menu as soft pills. */
.qli-store .woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.qli-store .woocommerce-MyAccount-navigation a { display: block; padding: 10px 14px; border-radius: 10px; color: var(--qli-ink); text-decoration: none; }
.qli-store .woocommerce-MyAccount-navigation .is-active a,
.qli-store .woocommerce-MyAccount-navigation a:hover { background: var(--qli-accent-soft); color: var(--qli-accent); font-weight: 650; }

@media (prefers-reduced-motion: reduce) {
  .qli-store .wc-block-cart__submit-button,
  .qli-store .wc-block-components-checkout-place-order-button,
  .qli-store #place_order,
  .qli-store .qli-order-open { transition: none; transform: none !important; }
}