/* ORWO (ORDE) shopping cart color overrides Replaces the default teal (#35b2b6) with ORWO dark (#060607) */ /* Hide the "Aktionen auf einen Blick" promotional bar on the cart page */ .headlineteaser { display: none !important; } /* Trust badge container: reset white background from .content-box base rule */ .content-box.badge { background: transparent !important; } /* Item price always ORWO red (#d40140), regardless of discount/highlight state. Without this the price is black for non-highlighted cases: desktop excluded product IDs, and the phone no-discount case ( with an unclassed price span). Desktop uses ; phone uses
containing . */ #shoppingcartForm .carttable td.price, #shoppingcartForm .carttable td.price .highlight, #shoppingcartForm .carttable td.descriptionBox .price .ItemPrice { color: #d40140 !important; } /* Hide crossed-out (old) prices in the cart item list */ .descriptionBox .price .-outdated, .descriptionBox .price .splitLine, .carttable.new-cart .price .-outdated, .carttable.new-cart .price .-outdated + br { display: none !important; } /* Align the item price LEFT on the MOBILE cart (the div.price block). Desktop uses and keeps the shared right-alignment. */ .carttable.new-cart div.price { text-align: left !important; } /* Main "Zur Kasse" checkout button */ #shoppingcartPaymentForm .pricesTable tr.priceUpd .action { background-color: #060607 !important; } #shoppingcartPaymentForm .pricesTable tr.priceUpd .action:hover { background-color: #282828 !important; } /* Arrow SVG icon on .button.-arrow */ #shoppingCartComponent.ORDE .content-box .button.-arrow:after, #shoppingCartComponent .content-box .button.-arrow:after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6.1 9.4'%3E%3Cpolygon fill='%23060607' points='4.7,3.3 1.4,0 0,1.4 3.3,4.7 0,8 1.4,9.4 4.7,6.1 6.1,4.7 '/%3E%3C/svg%3E"); } /* Gifting checkbox border and icon */ #shoppingcartForm .carttable td.descriptionBox .checkbox-gifting label:before { border: 1px solid #060607 !important; } #shoppingcartForm .carttable td.descriptionBox .checkbox-gifting input:checked+label:after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='49' viewBox='0 0 64 49'%3E%3Cpath d='M62.75 9.625c0 1.125-.375 2-1.125 2.75L26.875 47c-.75.75-1.625 1.125-2.75 1.125s-2-.375-2.75-1.125L1.25 26.875C.5 26.125.125 25.25.125 24.125s.375-2 1.125-2.75l5.5-5.5c.75-.75 1.625-1.125 2.75-1.125s2 .375 2.75 1.125L24.125 27.75l26.5-26.5C51.375.5 52.25.125 53.375.125s2 .375 2.75 1.125l5.5 5.5c.75.875 1.125 1.75 1.125 2.875z' fill='%23060607' fill-rule='evenodd'/%3E%3C/svg%3E"); } #shoppingcartForm .carttable td.descriptionBox .checkbox-gifting .infoindicator-blue { background-color: #060607 !important; } /* Delete / change links */ #shoppingcartForm .carttable .delete, #shoppingcartForm .carttable .change { color: #060607; } #shoppingcartForm .carttable .delete:hover, #shoppingcartForm .carttable .change:hover { text-decoration: underline; } /* "weiteres Foto hochladen" add button */ #shoppingcartForm .carttable .more.add .action { color: #060607; } #shoppingcartForm .carttable .more.add .action:hover { text-decoration: underline; } #shoppingcartForm .carttable .more.add .action:before { background: #060607; border: 1px solid #060607; } /* Greeting card add link */ #shoppingGreetingCardForm .greetingcard .text-box .add-link { color: #060607; } #shoppingGreetingCardForm .greetingcard .text-box .add-link:hover { text-decoration: underline; } /* Coupon input focus / apply button */ #shoppingcartCouponForm .additional .text-field:focus, #shoppingcartCouponForm .additional .text-field:active { border-color: #060607; } #shoppingcartCouponForm .additional .action { border: 2px solid #060607; color: #060607; } #shoppingcartCouponForm .additional .action:hover { text-decoration: underline; } /* Greeting card modal white button */ #greetingcard-modal .button.-white { color: #060607; border: 1px solid #060607; } #greetingcard-modal .button.-white:hover { text-decoration: underline; } /* Upload another button */ #uploadAnotherBlock #shoppingUploadAnotherForm .button.-action { color: #060607; border: 2px solid #060607; } #uploadAnotherBlock #shoppingUploadAnotherForm .button.-action:hover { text-decoration: underline; } /* Free shipping progress bar */ .free-shipping-progress-bar.threshold-reached .delivery-icon { color: #060607; } .free-shipping-progress-bar.threshold-reached .progress-message .message-threshold-reached { color: #060607; } .free-shipping-progress-bar .progress-bar-fill { background: #060607; } .free-shipping-progress-bar.threshold-reached .progress-bar-fill { background: #060607; } /* Quantity info border */ #shoppingcartForm .carttable .quantity-info { border: 2px solid #060607; } /* PayPal logo in sticky mobile payment bar */ .sticky-upper .payWithPaypal { display: inline; } /* Edit / Remove button icons (pencil / trash). On ORDE the cart's of /staticimages/svg/configurator/*.svg resolves EMPTY (the file is served by the static servlet, but the Facelet include returns nothing here), so the native wrappers render blank. Paint the icons by masking the (always-present) native box itself and colouring it with background-color (#060607, ORWO black); masking the avoids depending on the link's class and is safe if the include ever starts resolving (the mask just clips its content to the same shape). ORDE-only (this file only loads on ORDE). */ .buttonsCartEdit .editButtonUpd > svg, .buttonsCartEdit .removeButtonUpd > svg { margin-right: 6px; vertical-align: -2px; background-color: #060607; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; -webkit-mask-size: contain; mask-size: contain; } /* If the include DOES populate the svg (e.g. on desktop), its inner shapes default to teal (#35B2B6) and would show through the mask — force black so the icon is black regardless of whether the svg is empty or filled. */ .buttonsCartEdit .editButtonUpd > svg *, .buttonsCartEdit .removeButtonUpd > svg * { fill: #060607 !important; } .buttonsCartEdit .editButtonUpd > svg { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cg transform='translate(-1149 -489)'%3E%3Cpath d='M1164.80019,492.094054 L1163.37712,493.517162 L1160.48291,490.622985 L1161.90597,489.199878 C1162.0339,489.071901 1162.20744,489 1162.38839,489 C1162.56935,489 1162.74289,489.071901 1162.87082,489.199878 L1164.80019,491.129329 C1164.92813,491.257256 1165,491.430769 1165,491.611691 C1165,491.792614 1164.92813,491.966126 1164.80019,492.094054 Z M1151.61385,499.49208 L1154.50803,502.386256 L1162.4124,494.481887 L1159.51817,491.587711 L1151.61385,499.49208 Z M1149.01502,504.558891 C1148.97797,504.679612 1149.01064,504.810926 1149.09993,504.900219 C1149.18922,504.989512 1149.32054,505.022177 1149.44126,504.985126 L1153.48538,503.293019 L1150.70704,500.514768 L1149.01502,504.558891 Z'/%3E%3C/g%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cg transform='translate(-1149 -489)'%3E%3Cpath d='M1164.80019,492.094054 L1163.37712,493.517162 L1160.48291,490.622985 L1161.90597,489.199878 C1162.0339,489.071901 1162.20744,489 1162.38839,489 C1162.56935,489 1162.74289,489.071901 1162.87082,489.199878 L1164.80019,491.129329 C1164.92813,491.257256 1165,491.430769 1165,491.611691 C1165,491.792614 1164.92813,491.966126 1164.80019,492.094054 Z M1151.61385,499.49208 L1154.50803,502.386256 L1162.4124,494.481887 L1159.51817,491.587711 L1151.61385,499.49208 Z M1149.01502,504.558891 C1148.97797,504.679612 1149.01064,504.810926 1149.09993,504.900219 C1149.18922,504.989512 1149.32054,505.022177 1149.44126,504.985126 L1153.48538,503.293019 L1150.70704,500.514768 L1149.01502,504.558891 Z'/%3E%3C/g%3E%3C/svg%3E"); } .buttonsCartEdit .removeButtonUpd > svg { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 17'%3E%3Cg transform='translate(0 0.5)'%3E%3Cpath d='M0.65,14.72 C0.65,15.4269157 1.23203875,16 1.95,16 L11.05,16 C11.7679613,16 12.35,15.4269157 12.35,14.72 L12.35,4.48 L0.65,4.48 L0.65,14.72 Z M9.1,7.04 C9.1,6.68653776 9.39101491,6.4 9.75,6.4 C10.1089851,6.4 10.4,6.68653776 10.4,7.04 L10.4,13.44 C10.4,13.7934622 10.1089851,14.08 9.75,14.08 C9.39101491,14.08 9.1,13.7934622 9.1,13.44 L9.1,7.04 Z M5.85,7.04 C5.85,6.68653776 6.14101491,6.4 6.5,6.4 C6.85898509,6.4 7.15,6.68653776 7.15,7.04 L7.15,13.44 C7.15,13.7934622 6.85898509,14.08 6.5,14.08 C6.14101491,14.08 5.85,13.7934622 5.85,13.44 L5.85,7.04 Z M2.6,7.04 C2.6,6.68653776 2.89101491,6.4 3.25,6.4 C3.60898509,6.4 3.9,6.68653776 3.9,7.04 L3.9,13.44 C3.9,13.7934622 3.60898509,14.08 3.25,14.08 C2.89101491,14.08 2.6,13.7934622 2.6,13.44 L2.6,7.04 Z M13,1.92 L13,3.2 L0,3.2 L0,1.92 C0,1.56653776 0.291014913,1.28 0.65,1.28 L4.55,1.28 L4.55,0.64 C4.55,0.28653776 4.84101491,0 5.2,0 L7.8,0 C8.15898509,0 8.45,0.28653776 8.45,0.64 L8.45,1.28 L12.35,1.28 C12.7089851,1.28 13,1.56653776 13,1.92 Z'/%3E%3C/g%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 17'%3E%3Cg transform='translate(0 0.5)'%3E%3Cpath d='M0.65,14.72 C0.65,15.4269157 1.23203875,16 1.95,16 L11.05,16 C11.7679613,16 12.35,15.4269157 12.35,14.72 L12.35,4.48 L0.65,4.48 L0.65,14.72 Z M9.1,7.04 C9.1,6.68653776 9.39101491,6.4 9.75,6.4 C10.1089851,6.4 10.4,6.68653776 10.4,7.04 L10.4,13.44 C10.4,13.7934622 10.1089851,14.08 9.75,14.08 C9.39101491,14.08 9.1,13.7934622 9.1,13.44 L9.1,7.04 Z M5.85,7.04 C5.85,6.68653776 6.14101491,6.4 6.5,6.4 C6.85898509,6.4 7.15,6.68653776 7.15,7.04 L7.15,13.44 C7.15,13.7934622 6.85898509,14.08 6.5,14.08 C6.14101491,14.08 5.85,13.7934622 5.85,13.44 L5.85,7.04 Z M2.6,7.04 C2.6,6.68653776 2.89101491,6.4 3.25,6.4 C3.60898509,6.4 3.9,6.68653776 3.9,7.04 L3.9,13.44 C3.9,13.7934622 3.60898509,14.08 3.25,14.08 C2.89101491,14.08 2.6,13.7934622 2.6,13.44 L2.6,7.04 Z M13,1.92 L13,3.2 L0,3.2 L0,1.92 C0,1.56653776 0.291014913,1.28 0.65,1.28 L4.55,1.28 L4.55,0.64 C4.55,0.28653776 4.84101491,0 5.2,0 L7.8,0 C8.15898509,0 8.45,0.28653776 8.45,0.64 L8.45,1.28 L12.35,1.28 C12.7089851,1.28 13,1.56653776 13,1.92 Z'/%3E%3C/g%3E%3C/svg%3E"); } /* No Amazon Pay on ORDE — collapse the empty spacing the express-payment block would otherwise reserve. Mobile + desktop, ORDE only. */ .paymentMob { padding-bottom: 0 !important; } #mobilePaymentForm .express-payment { margin: 0 !important; } #newPaymentButtons { margin-bottom: 15px !important; } .adyen-checkout__paypal__button { margin-bottom: 0 !important; } /* Add a gap above the Amazon express button, but only when a PayPal express button renders before it. The sibling combinators match only when a preceding PayPal button (new Adyen v2 or old HPP) is present. ORDE only. */ #paypal-container ~ #AmazonExpressButton, #payPalExpressButton ~ #AmazonExpressButton { margin-top: 15px; }