/**
 * YK Bundle Display.
 *
 * Loaded on the cart, the checkout (order confirmation included), My Account's order view
 * and the product page of every WPC bundle. Set layout rules (pyjama sets and gift sets
 * with options, see yk_bd_has_set_layout()) are scoped to .yk-bd-set-layout on the product
 * element (yk_bd_set_layout_class), and in the cart and the order details to .yk-bd-set
 * (yk_bd_set_cart_item_class, yk_bd_set_order_item_class). Gift set rules cover the
 * other bundles.
 */

/* ── Cart, checkout and order details: a set's piece lines ("Shorts - sky, S") ─
   The value already starts with the piece name, so the label (dt, "Shorts:") is hidden
   and each value is one line, starting with a bullet like a list. The theme lays item
   data out in a grid with a 180px label column (style.css) and gives the value's <p> its
   paragraph font; the value keeps the item data's font instead. !important: the theme
   sets the grid with !important. */
.woocommerce .yk-bd-set td.product-name dl.variation {
	display: block !important;
}

.woocommerce .yk-bd-set td.product-name dl.variation dt {
	display: none !important;
}

.woocommerce .yk-bd-set td.product-name dl.variation dd p {
	font: inherit;
}

.woocommerce .yk-bd-set td.product-name dl.variation dd p::before {
	content: "\2022\00a0";
}

/* Cart page only: the piece lines in the product name's font (theme: .product-name a in
   css/woocommerce.css). The checkout keeps the item data font. */
.woocommerce-cart .yk-bd-set td.product-name dl.variation,
.woocommerce-cart .yk-bd-set td.product-name dl.variation dd {
	font-size: inherit;
}

.woocommerce-cart .yk-bd-set td.product-name dl.variation dd p {
	font-family: itc-american-typewriter, serif;
	font-weight: 500;
	color: #000;
}

/* ── Bundle page: no price per product ───────────────────────────────────────
   The price at the top already shows the bundle price. */
.product-type-woosb .woosb-products .woosb-product .woosb-price {
	display: none !important;
}

/* ── Gift set page (no set layout): no stock note per product ──────────────────────────────── */
.product-type-woosb:not(.yk-bd-set-layout) .woosb-products .woosb-product .woosb-availability {
	display: none !important;
}

/* ── Gift set page: bold labels in the short description ─────────────────────
   «Das Set enthält:», «Enthalten:» and «Material:» are <strong> in the text. The theme
   makes every <strong> regular (n0_lv style.css: strong { font-weight: 400 !important }),
   hence !important here, limited to the gift sets' short description. */
.product_cat-gift-sets .woocommerce-product-details__short-description strong {
	font-weight: 700 !important;
}

/* ── Gift set page: no fixed colour ──────────────────────────────────────────
   A gift set with options (e.g. the Yoko Striped pyjama gift sets) fixes the colour per
   set; only the size is picked. The colour row is hidden only when it has a single colour
   (placeholder + 1 option), so a gift set with a colour choice keeps it. !important: the
   set layout shows the rows with display: flex. */
.product_cat-gift-sets .woosb-products .woosb-product .variation-pa_farbe:not(:has(option:nth-of-type(3))) {
	display: none !important;
}

/* ── Bundle page (gift and pyjama sets): no "Vorrätig" ─────────────────────────
   Neither the set's own note nor a piece's (WPC's JS fills .woosb-availability with the
   chosen variation's note). Only the in-stock class: "Nicht vorrätig" and backorder
   notes stay. Also hides "Nur noch 2 vorrätig", which WooCommerce marks in-stock too. */
.product-type-woosb .entry-summary .stock.in-stock {
	display: none !important;
}

/* ── Set page: no thumbnail per product, no "Bundle-Preis" line ──────────────
   !important on the total: WPC's JS shows it with an inline display style (slideDown). */
.yk-bd-set-layout .woosb-products .woosb-product .woosb-thumb,
.yk-bd-set-layout .woosb-wrap .woosb-summary .woosb-total {
	display: none !important;
}

/* ── Set page: "(Rabatt 13%)" and the product names in the price's font ──────
   The theme's price rule (css/woocommerce.css: .entry-summary p.price span) reaches neither:
   WPC's JS adds the discount as small.woocommerce-price-suffix directly inside p.price. */
.yk-bd-set-layout .entry-summary p.price .woocommerce-price-suffix,
.yk-bd-set-layout .woosb-products .woosb-product .woosb-name,
.yk-bd-set-layout .woosb-products .woosb-product .woosb-name a {
	font-family: europa, sans-serif;
	font-weight: 400;
	font-size: 18px;
	line-height: 24px;
}

.yk-bd-set-layout .entry-summary p.price .woocommerce-price-suffix {
	color: #000;
}

/* Space before the swatches; none on a piece without options (e.g. the gift box). */
.yk-bd-set-layout .woosb-products .woosb-product .woosb-name:has(+ .variations_form) {
	margin-bottom: 1em;
}

/* ── Set page: colour and size rows like the main product form ──────────────
   The options are a table here (yk_bd_set_table_layout). This undoes WPC's boxed rows
   (frontend.css: inline-block, border, 12px label) and repeats WooCommerce's
   `div.product form.cart .variations` rules, which do not reach these forms. Label width
   and swatches come from YK WC Swatches (yk-lv-product.css). */
.yk-bd-set-layout .woosb-products .woosb-product .variations_form table.variations {
	display: table;
	width: 100%;
	margin: 0;
	border: 0;
}

.yk-bd-set-layout .woosb-products .woosb-product .variations_form table.variations tr.variation {
	display: flex;
	align-items: flex-start;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
}

.yk-bd-set-layout .woosb-products .woosb-product .variations_form table.variations tr.variation th.label,
.yk-bd-set-layout .woosb-products .woosb-product .variations_form table.variations tr.variation td.value {
	border: 0;
	font-size: inherit;
	line-height: 2em;
	vertical-align: top;
}

.yk-bd-set-layout .woosb-products .woosb-product .variations_form table.variations tr.variation th.label label {
	font-weight: 700;
	text-align: left;
}

/* "Farbe" and "Grösse" at the product name's size (18px, see above; the theme gives them
   20px), centred on the row of swatches. YK WC Swatches sets the row to
   align-items: flex-start !important, so the label cell centres itself (align-self). A line
   height of the text's own height keeps the theme's 40px line from pushing the text up. */
.yk-bd-set-layout .woosb-products .woosb-product .variations_form table.variations tr.variation th.label,
.yk-bd-set-layout .woosb-products .woosb-product .variations_form table.variations tr.variation th.label label {
	font-size: 18px;
	line-height: 24px;
}

.yk-bd-set-layout .woosb-products .woosb-product .variations_form table.variations tr.variation th.label {
	align-self: center;
	padding-top: 0;
	padding-bottom: 0;
}