/**
 * EU legal-warranty disclosure ("Gesetzliche Gewährleistung anzeigen").
 *
 * Shared by BOTH product layouts - the redesigned templates
 * (template-parts/product/content-*.php, where it sits below the .pdp-try line
 * in the buy column) and the old layout (woocommerce/single-product/price.php,
 * where it sits below the "Versandkostenfrei ab 69 €" .limited box) - which is
 * why these rules live in their own file instead of css/product.css: that one
 * only loads on the redesigned products.
 *
 * Nothing here is scoped to a layout wrapper, so selectors are kept at two
 * classes deep on purpose: the redesigned templates inline a
 * ".cn-pdp svg{width:22px;height:22px;...}" reset (see cn_render_product_page())
 * that a single-class selector would lose to.
 *
 * Markup: cn_pdp_render_warranty_label() | Behaviour: js/warranty-label.js
 */

/* Trigger row. It's a real link to the label PDF that JS upgrades into the
   modal, hence the explicit button-like, underline-free styling. */
.pdp-warranty{display:flex;align-items:center;gap:11px;width:100%;margin:16px 0 0;padding:13px 15px;border:1px solid #efecea;border-radius:10px;background:#fff;font-family:inherit;font-size:.93rem;font-weight:600;line-height:1.4;color:#032936;text-decoration:none;cursor:pointer;transition:border-color .15s ease,background-color .15s ease;}
.pdp-warranty:hover,
.pdp-warranty:focus{border-color:#d9d4d0;background:#fcfbfa;color:#032936;text-decoration:none;}
.pdp-warranty .pdp-warranty-txt{flex:1 1 auto;}
.pdp-warranty .pdp-warranty-ic{flex:0 0 auto;width:19px;height:19px;fill:none;stroke:#285bb8;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;}
.pdp-warranty .pdp-warranty-arrow{flex:0 0 auto;width:15px;height:15px;fill:none;stroke:#9E9E9E;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;}

/* Old layout only: .summary.entry-summary is a flex column whose children are
   ordered explicitly (style.css), with the .limited box at order 11 - without a
   matching order the trigger would jump to the top of the column instead of
   staying under that box. 12 keeps it directly beneath it. */
.product .summary.entry-summary > .pdp-warranty{order:12;}

/* Modal: a native <dialog>, so it renders in the browser's top layer (no
   z-index race with the sticky header/add-to-cart bar or the cookie banner),
   is unaffected by ancestor transforms, and gets ESC-to-close plus focus
   return for free. All padding sits on the inner panel, which is what lets
   js/warranty-label.js treat a click on the dialog itself as a backdrop
   click. */
.pdp-warranty-modal{border:0;padding:0;background:transparent;width:100%;max-width:min(560px,calc(100vw - 32px));max-height:calc(100vh - 40px);overflow:visible;}
.pdp-warranty-modal::backdrop{background:rgba(3,41,54,.55);}
.pdp-warranty-modal .pdp-warranty-panel{position:relative;background:#fff;border-radius:14px;padding:52px 20px 20px;max-height:calc(100vh - 40px);overflow-y:auto;-webkit-overflow-scrolling:touch;}
.pdp-warranty-modal .pdp-warranty-close{position:absolute;top:11px;right:11px;width:34px;height:34px;display:flex;align-items:center;justify-content:center;padding:0;border:0;border-radius:50%;background:#fff;color:#032936;cursor:pointer;transition:background-color .15s ease;}
.pdp-warranty-modal .pdp-warranty-close:hover{background:#efecea;}
.pdp-warranty-modal .pdp-warranty-close svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;}
.pdp-warranty-modal .pdp-warranty-img{display:block;width:100%;height:auto;border:1px solid #efecea;border-radius:6px;}
.pdp-warranty-modal .pdp-warranty-more{font-family:inherit;font-size:.88rem;color:#8a857f;margin:14px 0 0;line-height:1.55;}
.pdp-warranty-modal .pdp-warranty-more a{color:#285bb8;font-weight:600;text-decoration:underline;text-underline-offset:2px;}
.pdp-warranty-modal .pdp-warranty-more a:hover{color:#284985;}

/* Native modal dialogs make the page behind inert but do NOT stop it from
   scrolling; js/warranty-label.js toggles this class while the modal is open.
   The padding replaces the width the now-hidden document scrollbar was taking
   up, so the page behind the modal doesn't shift sideways when it opens or
   closes - the script measures the real scrollbar and sets
   --cn-scrollbar-width (0 on overlay-scrollbar platforms, where nothing needs
   compensating). */
html.cn-warranty-open{overflow:hidden;padding-right:var(--cn-scrollbar-width,0px);}
