/* TDR: touch layouts and checkout refinements, 2026-11-05.
   Loaded after theme styles; payment and phone validation rules remain in JS/Python. */
:root { --tdr-control-accent: #808c89; --tdr-control-border: #908d8d; }
.addToCartButton { font-size: 18px !important; }
#checkout_side_total { background-color: #808c89 !important; }
.selectorContainer { border-color: #908d8d !important; }
.formrow input, .formrow select, .reviewblock#phoneBlock .content input {
    box-sizing: border-box; border: solid 1px #908d8d; font-size: 1rem;
}
input[type="radio"] { accent-color: #808c89; }
.cartOverlay .selectorContainer.active > a > .selector .innerSelector,
.cartOverlay .selectorContainer.active > .selector .innerSelector,
#checkout_all .selectorContainer.active > a > .selector .innerSelector,
#checkout_all .selectorContainer.active > .selector .innerSelector { background: #808c89 !important; }
.cartOverlay .selectorContainer:not(.active) > a > .selector .innerSelector,
.cartOverlay .selectorContainer:not(.active) > .selector .innerSelector { background: transparent !important; }
.classicCart #transportmethodsdiv .radiocheckmark::after,
.radiocontainer .radiocheckmark::after { background-color: #808c89 !important; }
.ui-datepicker td:not(.ui-datepicker-unselectable):not(.ui-state-disabled) a.ui-state-default {
    background: #808c89 !important; color: #111 !important; border-color: #808c89 !important;
}
.ui-datepicker td:not(.ui-datepicker-unselectable):not(.ui-state-disabled) a.ui-state-default:hover,
.ui-datepicker td a.ui-state-active { outline: 2px solid #3e514b; outline-offset: -2px; }
.cartOverlay .addToCartButton, .classicCart #continue .addToCartButton,
#checkout_all .checkoutPrepaymentButton { background: #000 !important; color: #fff !important; border-color: #000 !important; }
#checkout_all #checkout_back_button, #checkout_all .deleteExtraAddressButton {
    background: #eee !important; color: #000 !important; border: 1px solid #ddd !important;
}
#checkout_all:has(.checkoutAddressRoles) #checkout_continue_button {
    height: auto; min-height: 56px; padding: 14px 20px; line-height: 1.4;
}
#checkout_all:has(.checkoutAddressRoles) #checkout_back_button { margin-top: 28px; min-height: 48px; height: auto; padding: 10px 20px; line-height: 1.4; }
#checkout_all:has(.checkoutAddressRoles) .checkout_side_buttondiv { padding-bottom: 24px; }
#checkout_all #phoneBlock { scroll-margin-block: 100px 180px; }
/* Compact upper overview: only name, quantity and price; no editable duplicates. */
#reviewCart .reviewCompactItems { width: 100%; border-collapse: collapse; table-layout: fixed; margin: 0; }
#reviewCart .reviewCompactItems th, #reviewCart .reviewCompactItems td { font-size: 14px; line-height: 1.45; padding: 10px 4px; text-align: left; vertical-align: top; border-bottom: 1px solid #ddd; overflow-wrap: anywhere; }
#reviewCart .reviewCompactItems th:first-child { width: auto; }
#reviewCart .reviewCompactItems th:nth-child(2), #reviewCart .reviewCompactItems td:nth-child(2) { width: 56px; text-align: center; }
#reviewCart .reviewCompactItems th:last-child, #reviewCart .reviewCompactItems td:last-child { width: 76px; text-align: right; white-space: nowrap; }
#reviewCart .reviewCompactTotal { display: flex; justify-content: space-between; gap: 16px; margin-top: 14px; font-size: 15px; }
/* Editable cart: separate grid areas prevent select/title collisions. */
#checkout_all .checkoutCartItems { width: 100%; min-width: 0; }
#checkout_all .checkoutCartHeading { padding: 12px 0; font-size: 18px; font-weight: 600; }
#checkout_all .checkoutCartItems .side_cart_item { display: block; width: 100%; margin: 0; padding: 16px 0; border-top: 1px solid #ddd; }
#checkout_all .checkoutCartItems .side_cart_item_inner {
    display: grid; grid-template-columns: 56px minmax(0, 1fr) auto;
    grid-template-areas: 'image article price' 'image quantity remove'; gap: 12px 16px;
    width: 100%; min-width: 0; align-items: start;
}
#checkout_all .checkoutCartItems .side_cart_image { grid-area: image; display: block; width: 56px; min-width: 0; margin: 0; padding: 0; position: static; }
#checkout_all .checkoutCartItems .side_cart_image img { display: block; width: 100%; height: 56px; object-fit: contain; }
#checkout_all .checkoutCartItems .side_cart_article { grid-area: article; min-width: 0; width: auto; margin: 0; padding: 0; position: static; overflow-wrap: anywhere; }
#checkout_all .checkoutCartItems .side_cart_article .titleline { padding: 0; margin: 0; font-size: 16px; line-height: 1.4; }
#checkout_all .checkoutCartItems .side_cart_price { grid-area: price; width: auto; margin: 0; padding: 0; position: static; font-size: 16px; white-space: nowrap; text-align: right; }
#checkout_all .checkoutCartItems .side_cart_quantity { grid-area: quantity; width: auto; min-width: 0; margin: 0; padding: 0; position: static; }
#checkout_all .checkoutCartItems .checkoutQuantityLabel { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 14px; }
#checkout_all .checkoutCartItems .quantityrow { display: inline-flex; width: auto; margin: 0; padding: 0; position: static; }
#checkout_all .checkoutCartItems .quantityrow select { box-sizing: border-box; width: auto; min-width: 90px; max-width: 100%; height: auto; min-height: 44px; margin: 0; padding: 8px 28px 8px 10px; border: 1px solid #908d8d; font-size: 16px; }
#checkout_all .checkoutCartItems .checkoutItemRemove { grid-area: remove; align-self: center; font-size: 13px; padding: 10px 0; color: #555; }
.orderConfirmation .orderConfirmationSummary { background: #dee6e4; }
/* Legal links stay in document flow after the actual final purchase control. */
body:has(#checkout_all) .checkoutLegalFooter { display: block !important; position: relative; clear: both; margin: 24px auto 0; z-index: 0; }
body:has(#checkout_all) .checkoutLegalFooter .horiLinks { display: flex !important; flex-wrap: wrap; justify-content: center; gap: 12px 20px; }
body:has(#checkout_all) .checkoutLegalFooter a { display: inline-block; padding: 8px 0; }
@media (pointer: coarse) {
    button, select, .checkoutPaymentLabel { touch-action: manipulation; }
    #checkout_all button:not(.symbolbutton), .cartOverlay button, .classicCart button { min-height: 44px; }
    .ui-datepicker td a { min-height: 36px; box-sizing: border-box; display: grid; place-items: center; }
}
/* iPad/tablet portrait and landscape, including split-screen widths. */
@media (min-width: 768px) and (max-width: 1366px) {
    .contentdiv { box-sizing: border-box; width: calc(100% - 48px); max-width: 1240px; margin-inline: auto; min-width: 0; }
    .articleMainContainer, .articleOuterContainer, .classicCart { box-sizing: border-box; max-width: 100%; min-width: 0; }
    .art_container { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; align-items: center; }
    .art_images { box-sizing: border-box; width: 100%; min-width: 0; margin: 0; }
    #art_image_main img { max-width: 100%; width: auto; height: auto; max-height: 460px; object-fit: contain; }
    .art_info { width: 100%; min-width: 0; font-size: 16px; }
    .art_info_price { min-width: 0; max-width: 100%; }
    .art_quantity select { min-height: 48px; font-size: 18px; max-width: 100%; }
    .art_title { font-size: clamp(24px, 2.6vw, 34px); overflow-wrap: anywhere; }
    ul.articlesList { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; margin: 0; padding: 0; }
    ul.articlesList > li.category_article { box-sizing: border-box; width: auto; min-width: 0; margin: 0; }
    ul.articlesList > li.pagebreak { display: none; }
    li.category_article img { max-width: 100%; height: auto; margin-inline: auto; }
    li.category_article .title { font-size: 20px; line-height: 1.35; }
    .cartOverlay { box-sizing: border-box; width: min(520px, 100vw); max-width: 100%; }
    #checkout_all .formrow input, #checkout_all .formrow select { min-height: 48px; max-width: 100%; }
    .classicCart #cartcontainer { gap: 24px; }
}
@media (min-width: 768px) and (max-width: 1180px) {
    #checkout_all, #checkout_all:has(#checkoutcontent[data-review-stripe="true"]) { display: block; box-sizing: border-box; width: 100%; max-width: 900px; margin-inline: auto; }
    #checkout_all > #checkoutcontent:not([data-review-stripe="true"]), #checkout_all > #cart_side { box-sizing: border-box; float: none; width: 100%; min-width: 0; max-width: 100%; margin: 24px 0 0; padding: 0; border: 0; }
    #checkout_all > #checkoutcontent[data-review-stripe="true"] { display: contents; }
    #checkout_all .checkoutReviewContent { width: 100%; min-width: 0; }
    #checkout_all #checkoutcontent[data-review-stripe="true"] > #checkout-payment-panel { width: 100%; max-width: 760px; margin: 28px auto; padding: 0; }
    #checkout_all .reviewrow { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
    #checkout_all .reviewcolumn { width: auto; min-width: 0; margin: 0; }
    #checkout_all .reviewblock, #checkout_all .reviewExtrablock { box-sizing: border-box; width: 100%; min-width: 0; }
    #checkout_all .checkout_side_buttondiv { max-width: 760px; margin-inline: auto; }
    .classicCart #cartcontainer { grid-template-columns: minmax(0, 1fr); }
}
@media (min-width: 768px) and (max-width: 900px) {
    ul.articlesList { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .art_container { gap: 20px; }
    #checkout_all .reviewrow { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767px) {
    #checkout_all .reviewrow { display: block; }
    #checkout_all .reviewcolumn { box-sizing: border-box; width: 100%; margin: 0; }
    #checkout_all .reviewblock { margin-top: 16px; margin-bottom: 16px; }
    #checkout_all #phoneBlock { margin-top: 12px; padding-top: 0; }
    #checkout_all #phoneBlock > .content { padding-top: 8px; }
    #checkout_all #phoneBlock input { min-height: 46px; font-size: 16px; }
    #checkout_all .checkoutCartItems .side_cart_item_inner { grid-template-columns: 44px minmax(0, 1fr) auto; gap: 12px 10px; }
    #checkout_all .checkoutCartItems .side_cart_image { width: 44px; }
    #checkout_all .checkoutCartItems .side_cart_image img { height: 44px; }
    #checkout_all .checkoutCartItems .side_cart_article .titleline, #checkout_all .checkoutCartItems .side_cart_price { font-size: 14px; }
    .orderConfirmation .orderConfirmationSummary > div:first-child dd { font-size: 16px; }
    .orderConfirmation .orderConfirmationSummary { background: #dee6e4; }
    .cartOverlay .preselectTransportTypeSelector[data-type="pickup"] > .text > a { line-height: 1.5; }
    .cartOverlay .pickupDateSelector { padding: 14px 12px; }
    .cartOverlay .pickupDateSelector > .text { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) { #checkout_all { scroll-behavior: auto; } }

.cartOverlay .outerSelector, #checkout_all .outerSelector, .classicCart #transportmethodsdiv .radiocheckmark { border-color: #808c89 !important; }
@media (min-width: 768px) and (max-width: 1366px) {
    ul.articlesList > li.category_article { display: flex; flex-direction: column; align-items: stretch; white-space: normal; justify-content: flex-start; }
    ul.articlesList li.category_article .ca_image, ul.articlesList li.category_article .ca_text { box-sizing: border-box; width: 100%; min-width: 0; max-width: 100%; margin: 0; }
    ul.articlesList li.category_article .ca_image { height: 240px; display: grid; place-items: center; }
    ul.articlesList li.category_article .ca_image img { max-width: 100%; max-height: 220px; width: auto; height: auto; object-fit: contain; }
    ul.articlesList li.category_article .title_outer { height: auto; min-height: 2.7em; }
    ul.articlesList li.category_article .title, ul.articlesList li.category_article .price { font-size: 20px; white-space: normal; line-height: 1.4; }
    ul.articlesList li.category_article .cartbutton_div { visibility: visible; }
    ul.articlesList li.category_article .cartbutton_div button { box-sizing: border-box; width: 100%; min-height: 46px; padding: 10px 12px; }
}

#checkout_all #phoneBlock input[aria-invalid="true"] { border-color: #b32025 !important; outline-color: #b32025 !important; }
#checkout_all #phoneBlock .phoneHint { color: #666; }

#checkout_all #checkout_continue_button:not(.buynow) { background: #000 !important; color: #fff !important; border-color: #000 !important; }

/* Mobile review: inline purchase above the lower cart; footer clears the floating bar. */
@media (max-width: 899px) {
    #checkout_all .checkoutMobilePurchaseSlot { margin-bottom: 20px; }
    body:has(#checkout_all .checkoutMobilePurchase.isFixed) .checkoutLegalFooter {
        padding-bottom: calc(var(--checkout-purchase-clearance, 180px) + 24px) !important;
    }
}