.as-garan { margin: .75rem 0; max-width: 100%; }
.as-garan__open { display: inline-flex; align-items: center; min-height: 44px; max-width: 100%; }
.as-garan-modal .as-garan-modal__original, .as-garan-modal .as-garan-modal__terms { color: #376400; text-decoration: underline; }
.as-garan-modal__terms { overflow-wrap: anywhere; }
.as-garan-modal .modal-title, .as-garan-modal__caption, .as-garan-modal__notice { color: #35424a; }
.as-garan__badge { display: block; width: 220px; max-width: 100%; height: auto; }
.as-garan__open:focus-visible { outline: 3px solid #185c89; outline-offset: 4px; }
/* Aquasabi20 energy-label box: grey border, 10px padding and bottom gap. */
#as-garan-product .as-garan { margin: 0 0 10px; padding: 10px; border: 1px solid #e5e5e5; background: #fff; box-sizing: border-box; }
#as-garan-product .as-garan:hover { border-color: #b0b0b0; }
@media (min-width: 768px) { #as-garan-product .as-garan { border-width: 2px; } }
#as-garan-product .as-garan__open { display: flex; width: 100%; box-sizing: border-box; }
#as-garan-product .as-garan__open:focus-visible { outline-offset: -2px; }
/* Basket and checkout follow the energy label: left on mobile, right from the theme's sm breakpoint.
   The class name stays "basket" on purpose: browsers keep the CSS bundle up to 7 days after an update. */
.as-garan-basket-labels .as-garan { margin: 0; text-align: left; white-space: normal; }
.as-garan-basket-labels .as-garan__badge { width: 140px; }
@media (min-width: 768px) { .as-garan-basket-labels .as-garan { text-align: right; } }
/* Header cart preview: the theme sets ".cart-dropdown .dropdown-cart-items img { width: 100%; height: auto }", the
   LIVE drop "ws cookie temp style" adds "width: auto !important"; the SVG has no intrinsic size. Size it by height
   like the energy label (21px) with higher specificity, so it works with and without that drop. */
.dropdown-cart-items .ee_label_cart_preview_container .as-garan__badge { width: auto; height: 21px; max-width: none; }
.dropdown-cart-items .ee_label_cart_preview_container .as-garan { line-height: 0; }
.dropdown-cart-items .ee_label_cart_preview_container .as-garan__open { min-height: 0; }
.as-garan-modal .modal-dialog { max-width: 800px; margin: 1rem auto; }
.as-garan-modal .modal-content { max-height: calc(100vh - 2rem); max-height: calc(100dvh - 2rem); }
.as-garan-modal .modal-header { display: flex; align-items: start; gap: 1rem; padding-right: 1rem; }
.as-garan-modal .modal-title { font-size: 1.25rem; flex: 1; }
.as-garan-modal .modal-header .close { position: static; margin: 0; padding: .5rem; min-width: 44px; min-height: 44px; transform: none; }
.as-garan-modal .modal-body { overflow-y: auto; }
.as-garan-modal__image { display: block; width: 100%; height: auto; background: #fff; }
.as-garan-modal__caption, .as-garan-modal__notice { overflow-wrap: anywhere; }
@media (max-width: 767.98px) { .as-garan-modal .modal-dialog { margin: .5rem; } }