/* FreshPen cart (Fase B1.8, 28 Oct 2026): the owner's "kurang rapih, kurang terstructure" cart in the checkout's look.
   WooCommerce's table stays (woocommerce/cart/cart.php), each row drawn as one compact line: picture, name and
   option, quantity, price, remove. The totals become a "Your order" card like the checkout's. Loaded on the cart only,
   after main.css, so every rule is scoped under .fcv. Colours: the site's zinc. */
.fcv { --v-ink: #09090b; --v-body: #52525b; --v-meta: #71717a; --v-line: #e4e4e7; --v-pale: #f4f4f5; --v-r: 20px; --v-rb: 12px; font-family: Inter, system-ui, sans-serif; }
body.woocommerce-cart .fp-basic-wrap > article:has(.fcv) > h1 { display: none; }   /* the page's own "Cart" title: one title only */
.fcv.fp-shop { padding-top: 0; }   /* the page already has its top space; with the "Cart" title gone this left an empty band */
.fcv .fp-shop__title { margin: 0 0 20px; font-size: clamp(26px, 3vw, 34px); line-height: 1.15; letter-spacing: -.02em; color: var(--v-ink); }
.fcv .fp-cart { gap: 30px; }
@media (min-width: 900px) { .fcv .fp-cart { grid-template-columns: minmax(0, 1fr) 380px; } }

/* rows */
.fcv .fp-cart table.shop_table, .fcv .fp-cart table.shop_table tbody { display: block; width: 100%; border: 0; margin: 0; }
.fcv .fp-cart table.shop_table thead { display: none; }
.fcv .fp-cart table.shop_table tr.cart_item { display: grid; grid-template-columns: 80px minmax(0, 1fr) 124px 128px 32px; grid-template-areas: "img name qty sub rm"; align-items: center; column-gap: 18px; padding: 16px 0; border-bottom: 1px solid var(--v-line); background: none; }
.fcv .fp-cart table.shop_table tr.cart_item:first-child { border-top: 1px solid var(--v-line); }
.fcv .fp-cart table.shop_table tr.cart_item td { display: block; width: auto; padding: 0; border: 0; background: none !important; text-align: left !important; }
.fcv .fp-cart table.shop_table tr.cart_item td::before { content: none !important; display: none !important; }
.fcv .fp-cart table.shop_table td.product-thumbnail { grid-area: img; display: block !important; }
.fcv .fp-cart table.shop_table td.product-thumbnail img { display: block; width: 80px; height: 80px; border-radius: var(--v-rb); background: var(--v-pale); object-fit: cover; }
.fcv .fp-cart table.shop_table td.product-name { grid-area: name; min-width: 0; font: 400 14px/20px Inter, system-ui, sans-serif; color: var(--v-body); }
.fcv .fp-cart table.shop_table td.product-name > a { display: block; font: 600 16px/22px Inter, system-ui, sans-serif; color: var(--v-ink); text-decoration: none; }
.fcv .fp-cart table.shop_table td.product-name dl.variation { display: flex; flex-wrap: wrap; gap: 0 6px; margin: 4px 0 0; font-size: 14px; color: var(--v-meta); }
.fcv .fp-cart table.shop_table td.product-name dl.variation dt, .fcv .fp-cart table.shop_table td.product-name dl.variation dd, .fcv .fp-cart table.shop_table td.product-name dl.variation p { margin: 0; padding: 0; float: none; font-weight: 400; }
.fcv-each { display: block; margin-top: 4px; font-size: 13px; color: var(--v-meta); }
.fcv-each .amount, .fcv-each bdi { font: inherit; color: inherit; }
.fcv .fp-cart table.shop_table td.product-price { display: none !important; }   /* the unit price shows under the name once there is more than one */
.fcv .fp-cart table.shop_table td.product-quantity { grid-area: qty; }
.fcv .fp-cart table.shop_table td.product-quantity .quantity .screen-reader-text { position: absolute; }   /* out of the flex row, or it clips the right border */
.fcv .fp-cart table.shop_table td.product-quantity .quantity { display: inline-flex; border: 1px solid #d4d4d8; border-radius: var(--v-rb); overflow: hidden; background: #fff; }
.fcv .fp-cart table.shop_table td.product-quantity input.qty { width: 64px; height: 42px; border: 0; text-align: center; font: 500 15px/1 Inter, system-ui, sans-serif; color: var(--v-ink); background: none; }
.fcv .fp-cart table.shop_table td.product-subtotal { grid-area: sub; text-align: right !important; font: 600 16px/22px Inter, system-ui, sans-serif; color: var(--v-ink); white-space: nowrap; font-variant-numeric: tabular-nums; }
.fcv .fp-cart table.shop_table td.product-remove { grid-area: rm; justify-self: end; }
.fcv .fp-cart table.shop_table td.product-remove a.remove { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; color: var(--v-meta) !important; background: none; font-size: 22px; line-height: 1; text-decoration: none; }
.fcv .fp-cart table.shop_table td.product-remove a.remove:hover { background: var(--v-pale) !important; color: var(--v-ink) !important; }

/* coupon as a small link, "Update cart" only without JavaScript */
.fcv .fp-cart table.shop_table tr.actions { display: block; }
.fcv .fp-cart table.shop_table tr.actions td { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 16px 0 0; border: 0; background: none !important; }
.fcv .fp-cart table.shop_table tr.actions td::before { content: none !important; }
.fcv-coupon { flex: 1 1 100%; }
.fcv-coupon summary { display: inline-block; cursor: pointer; list-style: none; font: 500 14px/20px Inter, system-ui, sans-serif; color: var(--v-ink); text-decoration: underline; text-underline-offset: 3px; }
.fcv-coupon summary::-webkit-details-marker { display: none; }
.fcv .fp-cart table.shop_table tr.actions .fcv-coupon .coupon { display: flex; gap: 8px; max-width: 420px; margin-top: 10px; float: none; }
.fcv .fp-cart table.shop_table tr.actions .coupon input#coupon_code { flex: 1; min-width: 0; width: auto; height: 44px; padding: 0 12px; border: 1px solid #d4d4d8; border-radius: var(--v-rb); font: 400 15px/1 Inter, system-ui, sans-serif; }
.fcv .fp-cart table.shop_table tr.actions .coupon button.button { height: 44px; padding: 0 18px; border: 0; border-radius: var(--v-rb); background: var(--v-ink); color: #fff; font: 600 14px/1 Inter, system-ui, sans-serif; }
.fcv-js .fcv .fp-cart table.shop_table tr.actions button[name="update_cart"] { display: none; }

/* totals: the checkout's "Your order" card */
.fcv .fp-cart .cart-collaterals .cart_totals { padding: 26px 28px; border: 0; border-radius: var(--v-r); background: var(--v-pale); top: 90px; }
.fcv .fp-cart .cart_totals h2 { margin: 0 0 12px; font: 700 21px/30px Inter, system-ui, sans-serif; color: var(--v-ink); }
.fcv .fp-cart .cart_totals table.shop_table { display: table; width: 100%; border: 0; }
.fcv .fp-cart .cart_totals table.shop_table tr th, .fcv .fp-cart .cart_totals table.shop_table tr td { padding: 8px 0; border: 0; background: none; font: 400 15px/22px Inter, system-ui, sans-serif; color: var(--v-body); vertical-align: top; }
.fcv .fp-cart .cart_totals table.shop_table tr td { text-align: right; color: var(--v-ink); }
.fcv .fp-cart .cart_totals table.shop_table tr td::before { content: none !important; }
.fcv .fp-cart .cart_totals table.shop_table tr.order-total th, .fcv .fp-cart .cart_totals table.shop_table tr.order-total td { padding-top: 14px; border-top: 1px solid #d4d4d8; font: 700 18px/24px Inter, system-ui, sans-serif; color: var(--v-ink); }
.fcv .fp-cart .cart_totals ul#shipping_method { margin: 0; padding: 0; list-style: none; }
.fcv .fp-cart .cart_totals .woocommerce-shipping-destination { margin: 4px 0 0; font-size: 13px; color: var(--v-meta); }
.fcv .fp-cart .wc-proceed-to-checkout { margin-top: 16px; padding: 0; }
.fcv .fp-cart .wc-proceed-to-checkout a.checkout-button { height: 52px; margin: 0; border-radius: var(--v-rb); background: var(--v-ink); font: 600 17px/1 Inter, system-ui, sans-serif; }

/* phones: picture | name, option, quantity | price and remove */
@media (max-width: 767px) {
  .fcv .fp-shop__title { margin-bottom: 14px; }
  .fcv .fp-cart { gap: 20px; }
  .fcv .fp-cart table.shop_table tr.cart_item { grid-template-columns: 72px minmax(0, 1fr) auto; grid-template-areas: "img name rm" "img qty qty"; column-gap: 12px; row-gap: 10px; align-items: start; padding: 14px 0; }
  .fcv .fp-cart table.shop_table td.product-thumbnail img { width: 72px; height: 72px; }
  .fcv .fp-cart table.shop_table td.product-name > a { font-size: 15px; line-height: 21px; }
  .fcv .fp-cart table.shop_table td.product-name dl.variation { font-size: 13px; }
  .fcv .fp-cart table.shop_table td.product-quantity input.qty { width: 56px; height: 38px; }
  /* quantity and price share the second line under the name, so the name keeps the full width */
  .fcv .fp-cart table.shop_table td.product-quantity { justify-self: start; }
  .fcv .fp-cart table.shop_table td.product-subtotal { grid-area: qty; justify-self: end; align-self: center; font-size: 15px; }
  .fcv .fp-cart table.shop_table td.product-remove { margin: -6px -6px 0 0; }
  .fcv .fp-cart .cart-collaterals .cart_totals { padding: 20px 18px; position: static; }
  .fcv .fp-cart .cart_totals h2 { font-size: 19px; line-height: 26px; }
}
@media (max-width: 768px) {   /* WooCommerce's small-screen table turns the totals into bare numbers: keep label and value */
  .fcv .fp-cart .cart_totals table.shop_table tr { display: table-row; }
  .fcv .fp-cart .cart_totals table.shop_table th, .fcv .fp-cart .cart_totals table.shop_table td { display: table-cell; }
}

/* B1.11 (28 Oct 2026): on phones the corner WhatsApp card and the back-to-top button covered "Proceed to checkout";
   the cart is short, so the floating buttons stay off here (the WhatsApp link is still in the footer) */
@media (max-width: 767px) {
  .fpwa, .fpcs-launch, .fpf__float { display: none !important; }
}