/* Stacked cart rows below 768px, as WooCommerce's own small-screen styles do. YOOtheme does not load those. */
@media (max-width: 767px) {
  .woocommerce table.shop_table_responsive { width: 100%; }
  .woocommerce table.shop_table_responsive thead { display: none; }
  .woocommerce table.shop_table_responsive tbody tr,
  .woocommerce table.shop_table_responsive tbody th,
  .woocommerce table.shop_table_responsive tbody td { display: block; }
  .woocommerce table.shop_table_responsive tbody tr { width: 100%; }
  .woocommerce table.shop_table_responsive tbody th { display: none; }
  .woocommerce table.shop_table_responsive tbody td {
    width: auto !important; max-width: none; box-sizing: border-box; white-space: normal;
    text-align: right !important; padding: 10px 4px;
  }
  .woocommerce table.shop_table_responsive tbody td .quantity { display: inline-block; width: auto; }
  .woocommerce table.shop_table_responsive tbody td input.qty { width: 4.5em; }
  .woocommerce table.shop_table_responsive tbody td::before {
    content: attr(data-title) ": "; float: left; font-weight: 600;
  }
  .woocommerce table.shop_table_responsive tbody td.product-remove::before,
  .woocommerce table.shop_table_responsive tbody td.actions::before,
  .woocommerce table.shop_table_responsive tbody td:not([data-title])::before { display: none; }
  .woocommerce table.cart td.product-thumbnail { display: none; }
  .woocommerce table.cart td.product-remove { text-align: left !important; }
  .woocommerce table.cart td.actions .coupon { display: flex; flex-direction: column; gap: 10px; float: none; }
  .woocommerce table.cart td.actions .coupon .input-text,
  .woocommerce table.cart td.actions .coupon .button,
  .woocommerce table.cart td.actions > .button { width: 100%; margin: 0 0 10px; box-sizing: border-box; }
  .woocommerce-cart-form { overflow-x: visible !important; }
  .woocommerce .cart_totals td.woocommerce-shipping-totals,
  .woocommerce .cart_totals tr.woocommerce-shipping-totals td { text-align: left !important; }
  .woocommerce .cart_totals tr.woocommerce-shipping-totals td::before { float: none; display: block; margin-bottom: 8px; }
}
/* DD-04: explicit fulfilment choice and the optional extras step use native WooCommerce cart markup. */
.dd-cart-way{margin:0 0 24px}.dd-cart-way h3{margin-bottom:12px}.dd-cart-way label{display:inline-flex;align-items:center;gap:8px;margin:0 20px 8px 0;cursor:pointer}.dd-cart-way input{margin:0}.dd-cart-way-error{color:#8a2c3a}.cross-sells{scroll-margin-top:120px}
/* 0.3.34 extras step: only the extras show; cart form and totals stay in the page for WooCommerce's cart script.
   The cards keep the shop's own card style (YOOtheme custom CSS, #tm-main ul.products). On phones one card per row
   with the picture pinned left of the text: six full cards were 3,200px, two to a row split "Add-on" and
   "Schmetterlings-Set" at 320-375px (review 01.11.2026). Longest word of all ten extras in EN/DE/ES at 320px:
   152px of 166px (Schmetterlings-Set). The theme makes the card link position:relative; static pins the picture to the card. */
.dd-extras-step .woocommerce-cart-form,.dd-extras-step .cart-collaterals{display:none}
.dd-extras-box{flex:0 0 100%;margin:0;scroll-margin-top:100px}.dd-extras-box h2{margin-bottom:14px}
.dd-extras-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;margin:0 0 26px}.dd-extras-actions .button{white-space:normal}
.dd-extras-bottom{margin:0}.dd-extras-back{color:#793e49;text-decoration:underline;text-underline-offset:3px}.dd-extras-box .dd-nowrap{white-space:nowrap}
@media (max-width:639px){
  #tm-main .dd-extras-box ul.products{grid-template-columns:1fr;gap:12px}
  #tm-main .dd-extras-box ul.products li.product{position:relative;min-height:110px;padding:10px 10px 12px 112px}
  #tm-main .dd-extras-box ul.products li.product .woocommerce-loop-product__link{position:static}
  #tm-main .dd-extras-box ul.products li.product .woocommerce-loop-product__link > img{position:absolute;top:10px;left:10px;width:88px;height:88px;object-fit:cover;margin:0}
  #tm-main .dd-extras-box ul.products li.product .woocommerce-loop-product__title{font-size:18px;padding:2px 0 0;min-height:0}
  #tm-main .dd-extras-box ul.products li.product .price{padding:0}
  #tm-main .dd-extras-box ul.products li.product .dd-card-choice{margin:4px 0 0;font-size:13px}
  #tm-main .dd-extras-box ul.products li.product .button{margin:10px 0 0;padding:11px 16px;white-space:normal}
}