/**
 * CheckoutWC — HumanBeanz Custom Styles
 * Overrides for: Side Cart + Checkout Page
 * Brand: Outfit font · Green #307B35 · Berry #AA3C68
 */

/* ============================================================
   GLOBAL / ROOT
   ============================================================ */
.cfw-side-cart-container,
#cfw-page {
    font-family: 'Outfit', sans-serif;
}

/* ============================================================
   SIDE CART
   ============================================================ */

/* --- Panel shell --- */
.cfw-side-cart-container {
    border-left: none !important;
    box-shadow: -8px 0 40px rgba(0, 0, 0, 0.12) !important;
    display: flex;
    flex-direction: column;
}

/* --- Header --- */
.cfw-side-cart-header {
    background: #307B35 !important;
    padding: 1.25rem 1.5rem !important;
    border-bottom: none !important;
    flex-shrink: 0;
}

.cfw-side-cart-header .cfw-side-cart-header-title,
.cfw-side-cart-header h2,
.cfw-side-cart-header h3 {
    color: #fff !important;
    font-family: 'Outfit', sans-serif !important;
    font-weight: 700 !important;
    font-size: 1.05rem !important;
    letter-spacing: -0.01em !important;
}

/* Cart item count badge in header */
.cfw-side-cart-header .cfw-item-count,
.cfw-side-cart-header .count {
    background: rgba(255, 255, 255, 0.2) !important;
    color: #fff !important;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.1rem 0.55rem;
}

/* Close button */
.cfw-side-cart-header .cfw-side-cart-close,
.cfw-side-cart-header button[class*="close"],
.cfw-side-cart-header .cfw-close {
    color: rgba(255, 255, 255, 0.75) !important;
    background: rgba(255, 255, 255, 0.12) !important;
    border-radius: 999px !important;
    width: 32px !important;
    height: 32px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: none !important;
    transition: background 0.2s !important;
}
.cfw-side-cart-header .cfw-side-cart-close:hover,
.cfw-side-cart-header button[class*="close"]:hover {
    background: rgba(255, 255, 255, 0.25) !important;
    color: #fff !important;
}

/* --- Cart Items area --- */
.cfw-side-cart-cart-contents {
    flex: 1;
    overflow-y: auto;
    padding: 0.5rem 0 !important;
}

/* Individual cart item */
.cfw-cart-item,
.cfw-side-cart-container .cart_item {
    padding: 1rem 1.25rem !important;
    border-bottom: 1px solid #f3f4f6 !important;
    display: flex;
    gap: 0.875rem;
    align-items: flex-start;
    transition: background 0.15s;
}
.cfw-cart-item:last-child,
.cfw-side-cart-container .cart_item:last-child {
    border-bottom: none !important;
}
.cfw-cart-item:hover {
    background: #f9fafb;
}

/* Product image */
.cfw-cart-item .cfw-cart-item-figure,
.cfw-cart-item figure,
.cfw-side-cart-container .cart_item img {
    width: 64px !important;
    height: 64px !important;
    min-width: 64px;
    border-radius: 12px !important;
    overflow: hidden !important;
    object-fit: cover !important;
    background: #f0f7f0;
    border: 1px solid #e5e7eb !important;
}

/* Product name */
.cfw-cart-item .cfw-cart-item-title a,
.cfw-cart-item-title,
.cfw-side-cart-container .cart_item .product-name a {
    font-family: 'Outfit', sans-serif !important;
    font-weight: 600 !important;
    font-size: 0.875rem !important;
    color: #1f2937 !important;
    line-height: 1.35 !important;
    text-decoration: none !important;
}
.cfw-cart-item .cfw-cart-item-title a:hover {
    color: #307B35 !important;
}

/* Variation data (e.g. Size: M) */
.cfw-cart-item .variation dd,
.cfw-cart-item .variation dt,
.cfw-cart-item .wc-item-meta,
.cfw-cart-item .variation {
    font-size: 0.75rem !important;
    color: #9ca3af !important;
}

/* Price */
.cfw-cart-item .cfw-cart-item-subtotal,
.cfw-cart-item .product-subtotal,
.cfw-side-cart-container .cart_item .product-total {
    font-family: 'Outfit', sans-serif !important;
    font-weight: 700 !important;
    font-size: 0.9rem !important;
    color: #307B35 !important;
}

/* Quantity controls */
.cfw-cart-item .quantity,
.cfw-cart-item .cfw-quantity {
    display: inline-flex !important;
    align-items: center !important;
    border: 1.5px solid #e5e7eb !important;
    border-radius: 999px !important;
    overflow: hidden !important;
    height: 30px !important;
    background: #fff !important;
}

.cfw-cart-item .cfw-quantity-minus,
.cfw-cart-item .cfw-quantity-plus,
.cfw-side-cart-container button.quantity-btn {
    background: transparent !important;
    border: none !important;
    width: 28px !important;
    height: 28px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 1rem !important;
    color: #6b7280 !important;
    cursor: pointer !important;
    transition: color 0.15s, background 0.15s !important;
}
.cfw-cart-item .cfw-quantity-minus:hover,
.cfw-cart-item .cfw-quantity-plus:hover {
    color: #307B35 !important;
    background: #f0f7f0 !important;
}

.cfw-cart-item input.cfw-quantity-input,
.cfw-cart-item input[type="number"] {
    width: 36px !important;
    text-align: center !important;
    border: none !important;
    font-family: 'Outfit', sans-serif !important;
    font-size: 0.875rem !important;
    font-weight: 600 !important;
    color: #1f2937 !important;
    background: transparent !important;
    -moz-appearance: textfield !important;
    padding: 0 !important;
}
.cfw-cart-item input[type="number"]::-webkit-outer-spin-button,
.cfw-cart-item input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
}

/* Remove (×) link */
.cfw-cart-item .remove,
.cfw-cart-item a.remove,
.cfw-side-cart-container .cart_item .remove {
    font-size: 0 !important;
    width: 20px !important;
    height: 20px !important;
    border-radius: 999px !important;
    background: #f3f4f6 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #9ca3af !important;
    transition: background 0.15s, color 0.15s !important;
    flex-shrink: 0;
}
.cfw-cart-item .remove::before,
.cfw-cart-item a.remove::before {
    content: '×';
    font-size: 0.9rem;
    font-weight: 700;
    line-height: 1;
}
.cfw-cart-item .remove:hover,
.cfw-cart-item a.remove:hover {
    background: #fee2e2 !important;
    color: #ef4444 !important;
}

/* Empty cart message */
.cfw-side-cart-empty-message,
.cfw-side-cart-container .empty-cart-message {
    text-align: center !important;
    padding: 3rem 1.5rem !important;
    color: #9ca3af !important;
    font-size: 0.9rem !important;
    font-family: 'Outfit', sans-serif !important;
}

/* --- Footer (totals + CTA) --- */
.cfw-side-cart-footer {
    border-top: 1px solid #f3f4f6 !important;
    padding: 1.25rem 1.5rem !important;
    background: #fff !important;
    flex-shrink: 0;
}

/* Totals row */
.cfw-side-cart-footer .cfw-totals,
.cfw-side-cart-total-row,
.cfw-side-cart-footer tr.order-total,
.cfw-side-cart-footer .woocommerce-Price-amount {
    font-family: 'Outfit', sans-serif !important;
}

.cfw-side-cart-footer .cart-subtotal th,
.cfw-side-cart-footer .order-total th,
.cfw-side-cart-total-row .total-label {
    font-weight: 600 !important;
    font-size: 0.875rem !important;
    color: #374151 !important;
}

.cfw-side-cart-footer .cart-subtotal td,
.cfw-side-cart-footer .order-total td bdi,
.cfw-side-cart-footer .order-total .woocommerce-Price-amount,
.cfw-side-cart-total-row .total-amount {
    font-weight: 700 !important;
    font-size: 1.05rem !important;
    color: #1f2937 !important;
}

/* Shipping line */
.cfw-side-cart-footer .shipping th,
.cfw-side-cart-footer .shipping td {
    font-size: 0.8rem !important;
    color: #9ca3af !important;
}

/* Checkout CTA button */
.cfw-side-cart-checkout-btn,
.cfw-side-cart-footer a.button,
.cfw-side-cart-footer .cfw-checkout-button,
.cfw-side-cart-footer button.cfw-checkout-button,
.cfw-side-cart-footer a[href*="checkout"] {
    display: block !important;
    width: 100% !important;
    background: #307B35 !important;
    color: #fff !important;
    font-family: 'Outfit', sans-serif !important;
    font-weight: 700 !important;
    font-size: 0.9375rem !important;
    letter-spacing: -0.01em !important;
    text-align: center !important;
    padding: 0.875rem 1.5rem !important;
    border-radius: 999px !important;
    border: none !important;
    cursor: pointer !important;
    margin-top: 1rem !important;
    text-decoration: none !important;
    transition: background 0.2s, transform 0.15s, box-shadow 0.2s !important;
    box-shadow: 0 4px 16px rgba(48, 123, 53, 0.28) !important;
}
.cfw-side-cart-checkout-btn:hover,
.cfw-side-cart-footer a.button:hover,
.cfw-side-cart-footer .cfw-checkout-button:hover {
    background: #2E7D32 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 20px rgba(48, 123, 53, 0.36) !important;
    color: #fff !important;
}

/* "Continue shopping" / view cart links */
.cfw-side-cart-footer .cfw-view-cart,
.cfw-side-cart-footer .continue-shopping,
.cfw-side-cart-footer a[href*="/cart"]:not([href*="checkout"]) {
    display: block !important;
    text-align: center !important;
    color: #6b7280 !important;
    font-size: 0.8125rem !important;
    font-family: 'Outfit', sans-serif !important;
    text-decoration: none !important;
    margin-top: 0.625rem !important;
    transition: color 0.15s !important;
}
.cfw-side-cart-footer .cfw-view-cart:hover {
    color: #307B35 !important;
}

/* Promo/coupon note in footer */
.cfw-side-cart-footer .cfw-coupon,
.cfw-side-cart-footer .coupon-note {
    font-size: 0.8rem;
    color: #9ca3af;
    text-align: center;
    margin-bottom: 0.5rem;
}


/* ============================================================
   CHECKOUT PAGE
   ============================================================ */

/* Outer wrapper */
#cfw-page {
    background: #f9fafb !important;
}

/* Logo / breadcrumb strip */
.cfw-page-top,
#cfw-page .cfw-page-top {
    background: #fff !important;
    border-bottom: 1px solid #e5e7eb !important;
}

/* Site name / logo in checkout header */
.cfw-page-top .cfw-site-name,
.cfw-page-top a.site-name {
    font-family: 'Outfit', sans-serif !important;
    font-weight: 800 !important;
    color: #307B35 !important;
    letter-spacing: -0.02em !important;
}

/* Breadcrumb steps */
#cfw-page .cfw-breadcrumb a,
#cfw-page .cfw-breadcrumb span {
    font-family: 'Outfit', sans-serif !important;
    font-size: 0.8125rem !important;
    font-weight: 500 !important;
}
#cfw-page .cfw-breadcrumb .completed a {
    color: #307B35 !important;
}
#cfw-page .cfw-breadcrumb .current span {
    color: #307B35 !important;
    font-weight: 700 !important;
}

/* --- Left column — form --- */
#cfw-left {
    background: transparent !important;
}

/* Section / step heading */
#cfw-page .cfw-step-heading,
#cfw-page .cfw-section-title,
#cfw-page h3[class*="step"] {
    font-family: 'Outfit', sans-serif !important;
    font-weight: 700 !important;
    font-size: 1.0625rem !important;
    color: #1f2937 !important;
    letter-spacing: -0.01em !important;
    margin-bottom: 1.25rem !important;
    padding-bottom: 0.75rem !important;
    border-bottom: 1px solid #e5e7eb !important;
}

/* Form cards / panels */
#cfw-page .cfw-panel,
#cfw-page .woocommerce-checkout-payment,
#cfw-page .cfw-checkout-step-wrap {
    background: #fff !important;
    border-radius: 16px !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.04) !important;
    padding: 1.5rem !important;
    margin-bottom: 1rem !important;
}

/* Form inputs */
#cfw-page .cfw-input-wrap input,
#cfw-page .cfw-input-wrap select,
#cfw-page .cfw-input-wrap textarea,
#cfw-page input[type="text"],
#cfw-page input[type="email"],
#cfw-page input[type="tel"],
#cfw-page input[type="password"],
#cfw-page select,
#cfw-page textarea {
    font-family: 'Outfit', sans-serif !important;
    font-size: 0.9375rem !important;
    color: #1f2937 !important;
    background: #fff !important;
    border: 1.5px solid #e5e7eb !important;
    border-radius: 10px !important;
    padding: 0.625rem 0.875rem !important;
    transition: border-color 0.15s, box-shadow 0.15s !important;
    box-shadow: none !important;
}
#cfw-page .cfw-input-wrap input:focus,
#cfw-page .cfw-input-wrap select:focus,
#cfw-page input[type="text"]:focus,
#cfw-page input[type="email"]:focus,
#cfw-page input[type="tel"]:focus,
#cfw-page input[type="password"]:focus,
#cfw-page select:focus,
#cfw-page textarea:focus {
    outline: none !important;
    border-color: #307B35 !important;
    box-shadow: 0 0 0 3px rgba(48, 123, 53, 0.12) !important;
}

/* Floating label text */
#cfw-page .cfw-input-wrap label,
#cfw-page label {
    font-family: 'Outfit', sans-serif !important;
    font-size: 0.8125rem !important;
    font-weight: 500 !important;
    color: #6b7280 !important;
}

/* Checkbox */
#cfw-page input[type="checkbox"] {
    accent-color: #307B35 !important;
    width: 16px !important;
    height: 16px !important;
    border-radius: 4px !important;
}
#cfw-page input[type="radio"] {
    accent-color: #307B35 !important;
}

/* Payment method radio rows */
#cfw-page .wc_payment_method label,
#cfw-page .payment_method label {
    font-family: 'Outfit', sans-serif !important;
    font-size: 0.9rem !important;
    font-weight: 500 !important;
    color: #374151 !important;
}

/* --- Coupon row --- */
#cfw-page .cfw-coupon-form input[type="text"] {
    border-radius: 999px 0 0 999px !important;
}
#cfw-page .cfw-coupon-form button,
#cfw-page .cfw-coupon-form .button {
    border-radius: 0 999px 999px 0 !important;
    background: #307B35 !important;
    color: #fff !important;
    font-family: 'Outfit', sans-serif !important;
    font-weight: 600 !important;
    border: none !important;
    padding: 0 1.25rem !important;
    transition: background 0.2s !important;
}
#cfw-page .cfw-coupon-form button:hover {
    background: #2E7D32 !important;
}

/* --- Primary / Next Step buttons --- */
#cfw-page .cfw-btn-primary,
#cfw-page button.cfw-btn-primary,
#cfw-page a.cfw-btn-primary,
#cfw-page .cfw-next-step-btn {
    font-family: 'Outfit', sans-serif !important;
    font-weight: 700 !important;
    font-size: 0.9375rem !important;
    background: #307B35 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 999px !important;
    padding: 0.8125rem 2rem !important;
    cursor: pointer !important;
    transition: background 0.2s, transform 0.15s, box-shadow 0.2s !important;
    box-shadow: 0 4px 16px rgba(48, 123, 53, 0.26) !important;
}
#cfw-page .cfw-btn-primary:hover,
#cfw-page .cfw-next-step-btn:hover {
    background: #2E7D32 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 20px rgba(48, 123, 53, 0.34) !important;
    color: #fff !important;
}

/* --- Place Order button --- */
#cfw-complete-order-button,
#cfw-page button#cfw-complete-order-button,
#cfw-page .woocommerce-checkout #place_order {
    display: block !important;
    width: 100% !important;
    font-family: 'Outfit', sans-serif !important;
    font-weight: 700 !important;
    font-size: 1rem !important;
    letter-spacing: -0.01em !important;
    background: #307B35 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 999px !important;
    padding: 1rem 2rem !important;
    cursor: pointer !important;
    transition: background 0.2s, transform 0.15s, box-shadow 0.2s !important;
    box-shadow: 0 4px 20px rgba(48, 123, 53, 0.3) !important;
    margin-top: 1rem !important;
}
#cfw-complete-order-button:hover,
#cfw-page .woocommerce-checkout #place_order:hover {
    background: #2E7D32 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 24px rgba(48, 123, 53, 0.38) !important;
}

/* --- Right column — Order summary --- */
#cfw-right {
    background: transparent !important;
}

/* Order summary card */
#cfw-page #cfw-order-review,
#cfw-page .cfw-cart-summary {
    background: #fff !important;
    border-radius: 16px !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.04) !important;
    overflow: hidden !important;
}

/* Summary header */
#cfw-page .cfw-cart-summary-header,
#cfw-page #order_review_heading {
    font-family: 'Outfit', sans-serif !important;
    font-weight: 700 !important;
    font-size: 0.9375rem !important;
    color: #1f2937 !important;
    padding: 1rem 1.25rem !important;
    border-bottom: 1px solid #f3f4f6 !important;
    background: #fafafa !important;
}

/* Summary product rows */
#cfw-page .cfw-cart-summary-list li,
#cfw-page .shop_table.woocommerce-checkout-review-order-table tr {
    font-family: 'Outfit', sans-serif !important;
    border-bottom: 1px solid #f3f4f6 !important;
    padding: 0.75rem 1.25rem !important;
}

#cfw-page .cfw-cart-summary-list .product-name,
#cfw-page .shop_table .product-name {
    font-size: 0.875rem !important;
    font-weight: 600 !important;
    color: #1f2937 !important;
}

#cfw-page .cfw-cart-summary-list .product-total,
#cfw-page .shop_table .product-total {
    font-size: 0.875rem !important;
    font-weight: 700 !important;
    color: #307B35 !important;
}

/* Totals rows */
#cfw-page .cfw-totals-list tr,
#cfw-page .shop_table.woocommerce-checkout-review-order-table tfoot tr {
    font-family: 'Outfit', sans-serif !important;
    padding: 0.5rem 1.25rem !important;
}

#cfw-page tfoot tr.order-total th,
#cfw-page tfoot tr.order-total td {
    font-weight: 800 !important;
    font-size: 1rem !important;
    color: #1f2937 !important;
    border-top: 1px solid #e5e7eb !important;
    padding-top: 1rem !important;
}

/* Trust notice beneath place order */
#cfw-page .cfw-below-order-button,
#cfw-page .cfw-secure-notice {
    text-align: center !important;
    font-size: 0.75rem !important;
    color: #9ca3af !important;
    font-family: 'Outfit', sans-serif !important;
    margin-top: 0.75rem !important;
}

/* Error / notice messages */
#cfw-page .woocommerce-error,
#cfw-page .woocommerce-message {
    border-radius: 10px !important;
    font-family: 'Outfit', sans-serif !important;
    font-size: 0.875rem !important;
}
#cfw-page .woocommerce-error {
    border-left-color: #AA3C68 !important;
    background: #fdf0f4 !important;
    color: #8A2E54 !important;
}
#cfw-page .woocommerce-message {
    border-left-color: #307B35 !important;
    background: #f0f7f0 !important;
    color: #2E7D32 !important;
}

/* Loading spinner — brand green */
#cfw-page .blockUI.blockOverlay::after,
#cfw-page .blockUI.blockOverlay {
    border-top-color: #307B35 !important;
}

/* Empty side cart: full-width brand button back to the shop (2026-09-27) */
#cfw_empty_side_cart_message{ text-align:center; font-family:'Outfit',system-ui,sans-serif; font-weight:600; color:#20303b; }
#cfw_empty_side_cart_message .hb-empty-cart-cta{
  display:flex; align-items:center; justify-content:center; min-height:48px; margin:1rem auto 0; max-width:320px;
  border-radius:999px; background:#307B35; color:#fff !important; text-decoration:none !important; font-weight:700;
}
#cfw_empty_side_cart_message .hb-empty-cart-cta:hover{ background:#276a43; }
