/* DragonBox modernization — first review, 2026-10-19.
   Loaded only by ZOneThemeDev. Functional hooks and breakpoints stay intact. */
:root {
  --dbx-accent: #ee5c04;
  --dbx-accent-light: #ff8c3b;
  --dbx-page: #444648;
  --dbx-surface: #303234;
  --dbx-surface-raised: #3b3d40;
  --dbx-border: #55585b;
  --dbx-text: #f4f4f4;
  --dbx-text-muted: #c5c7c9;
  --dbx-radius: 10px;
  --dbx-shadow: 0 3px 10px rgba(0,0,0,.24);
}
body, body #wrapper { background-color: var(--dbx-page); }
#left-column .column-block,
#right-column .column-block {
  background: linear-gradient(155deg, #3b3d3f, #303234);
  border: 1px solid var(--dbx-border);
  border-radius: var(--dbx-radius);
  box-shadow: var(--dbx-shadow);
}
.product-miniature .product-container.product-style {
  background: linear-gradient(155deg, #36383a, #292b2d);
  border: 1px solid #55585b;
  border-radius: var(--dbx-radius);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), var(--dbx-shadow);
  overflow: hidden;
  transform: none;
  transition: border-color .18s ease, box-shadow .18s ease;
  min-width: 0;
}
.product-miniature .product-container.product-style:hover {
  transform: none;
  border-color: #8e694e;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 5px 15px rgba(0,0,0,.32);
}
.product-miniature .product-container.product-style .first-block {
  flex: 0 0 auto;
  min-width: 0;
  background: #222;
}
.product-miniature .product-container.product-style .product-cover-link {
  display: block;
}
.product-miniature .product-container.product-style .dbx-manufacturer-strip {
  height: 40px;
  min-height: 40px;
  background: linear-gradient(180deg, #303234, #2b2d2f);
  border-top-color: #414345;
  border-bottom-color: #414345;
}
.product-miniature .product-container.product-style .dbx-manufacturer-link {
  padding: 4px 10px;
  column-gap: 7px;
}
.product-miniature .product-container.product-style .dbx-manufacturer-label {
  font-size: 11px;
  font-weight: 400;
  color: var(--dbx-text-muted);
}
.product-miniature .product-container.product-style .dbx-manufacturer-logo-wrap {
  height: 30px;
}
.product-miniature .product-container.product-style .dbx-manufacturer-logo {
  max-height: 28px;
}
.product-miniature .product-container.product-style .second-third-block {
  min-width: 0;
  flex: 1 1 auto;
}
.product-miniature .product-container.product-style .second-block {
  padding: 12px 12px 8px;
  min-width: 0;
}
.product-list .grid .product-miniature .second-block .product-name,
.product-miniature .product-container.product-style .second-block .product-name {
  background: transparent;
  height: 4.05em;
  min-height: 4.05em;
  padding: 0;
  margin: 0 0 9px;
  font-size: 14px;
  line-height: 1.35;
  letter-spacing: 0;
  text-align: left;
  align-items: flex-start;
  justify-content: flex-start;
}
.product-miniature .product-container.product-style .second-block .product-name a {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  text-align: left;
  color: var(--dbx-text);
  overflow-wrap: anywhere;
}
.product-miniature .product-container.product-style .second-block .product-name a:hover {
  color: var(--dbx-accent-light);
}
.product-list .grid .product-miniature .product-container.product-style .second-block > .product-availability,
.product-miniature .product-container.product-style .second-block .product-availability {
  height: auto;
  min-height: 32px;
  max-height: none;
  margin: 0 0 7px;
  overflow: visible;
  text-align: center;
  font-size: 12px;
  line-height: 1.35;
}
.product-miniature .product-container.product-style .product-availability span {
  display: inline-block;
  max-width: 100%;
  padding: 3px 7px;
  border-radius: 5px;
  white-space: normal;
}
.product-list .grid .product-miniature .product-container.product-style .second-block > .variant-links,
.product-miniature .product-container.product-style .second-block .variant-links {
  margin: 0;
  height: 24px;
  min-height: 24px;
}
.product-miniature .product-container.product-style .variant-links-wrapper {
  justify-content: flex-start;
}
.product-list .grid .product-miniature .product-container.product-style .third-block,
.product-miniature .product-container.product-style .third-block {
  width: 100%;
  padding: 10px 12px 12px;
  margin-top: auto;
  flex: 0 0 auto;
  min-height: 0;
  align-items: stretch;
  justify-content: flex-start;
  background: rgba(0,0,0,.14);
  border-top: 1px solid #484b4d;
  gap: 10px;
}
.product-miniature .product-container.product-style .third-block-left {
  width: 100%;
  margin: 0;
  min-height: 52px;
  grid-template-rows: 18px minmax(34px,auto);
}
.product-miniature .product-container.product-style .third-block-left > .product-list-reviews,
.product-miniature .product-container.product-style .third-block-left .js-product-comment {
  grid-row: 1;
  min-height: 18px;
  height: 18px;
}
.product-miniature .product-container.product-style .third-block-left .product-price-and-shipping {
  height: auto;
  min-height: 34px;
  flex-wrap: wrap;
  gap: 4px 8px;
}
.product-miniature .product-container.product-style .product-price-and-shipping .price {
  font-size: 23px;
  line-height: 1.2;
  font-weight: 700;
  color: var(--dbx-accent-light);
}
.product-miniature .product-container.product-style .product-price-and-shipping .first-prices {
  justify-content: center;
  gap: 3px 7px;
}
.product-list .grid .product-miniature .product-container.product-style .buttons-sections,
.product-miniature .product-container.product-style .buttons-sections {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-end;
  gap: 8px;
  width: 100%;
  min-height: 44px;
  margin: 0;
}
.product-miniature .product-container.product-style .buttons-sections .btn {
  width: 100%;
  max-width: 100%;
  min-height: 44px;
  height: auto;
  margin: 0;
  padding: 10px 8px;
  border-radius: 7px;
  font-size: 13px;
  line-height: 1.4;
  white-space: normal;
}
.product-miniature .product-container.product-style .buttons-sections .add-to-cart {
  color: #fff;
  background: linear-gradient(180deg, #f87418, #cf4c00);
  border: 1px solid #f8873c;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 2px 4px rgba(0,0,0,.18);
}
.product-miniature .product-container.product-style .buttons-sections .add-to-cart:hover {
  background: linear-gradient(180deg, #ff8a32, #e65c08);
}
.product-miniature .product-container.product-style .buttons-sections .details-link {
  background: #3b3e41;
  border-color: #72767a;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
  color: #e3e5e7;
}
.product-miniature .product-container.product-style .buttons-sections .details-link:hover {
  background: #484b4e;
  border-color: var(--dbx-accent-light);
}
.product-miniature .product-container.product-style a:focus-visible,
.product-miniature .product-container.product-style button:focus-visible {
  outline: 2px solid #ffb87e;
  outline-offset: -3px;
}
/* Equal slots for primary action and wishlist. */
.product-list .grid .product-miniature .product-container.product-style .buttons-sections {
  min-height: 96px;
}
.product-list .product-miniature .product-container.product-style .buttons-sections .btn {
  margin: 0;
}
@media (min-width: 992px) {
  /* A true horizontal catalogue row; carousel grids keep their own layout. */
  .product-list .list .product-miniature .product-container.product-style {
    display: grid;
    grid-template-columns: minmax(150px, 24%) minmax(0, 1fr);
    height: auto;
    width: 100%;
    align-items: stretch;
  }
  .product-list .list .product-miniature .product-container.product-style .first-block {
    width: 100%;
  }
  .product-list .list .product-miniature .product-container.product-style .second-third-block {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(175px, 34%);
    padding: 0;
    width: 100%;
  }
  .product-list .list .product-miniature .product-container.product-style .second-block {
    width: 100%;
    padding: 18px;
  }
  .product-list .list .product-miniature .product-container.product-style .product-name {
    height: auto;
    min-height: 0;
    font-size: 17px;
  }
  .product-list .list .product-miniature .product-container.product-style .product-description-short {
    display: -webkit-box !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
    line-height: 1.5;
    font-size: 13px;
    color: var(--dbx-text-muted);
    margin: 8px 0 12px;
  }
  .product-list .list .product-miniature .product-container.product-style .third-block {
    align-self: stretch;
    border-top: 0;
    border-left: 1px solid #484b4d;
    margin: 0;
    padding: 18px 12px;
    justify-content: center;
  }
}
@media (max-width: 767.98px) {
  .product-miniature .product-container.product-style .second-block { padding: 10px 9px 7px; }
  .product-list .grid .product-miniature .product-container.product-style .third-block,
  .product-miniature .product-container.product-style .third-block { padding: 9px; }
  .product-miniature .product-container.product-style .dbx-manufacturer-label { font-size: 10px; }
  .product-miniature .product-container.product-style .dbx-manufacturer-link { padding: 4px 7px; gap: 4px; }
  .product-miniature .product-container.product-style .product-price-and-shipping .price { font-size: 21px; }
}
@media (prefers-reduced-motion: reduce) {
  .product-miniature .product-container.product-style { transition: none; }
}

/* Native full-card link: preserves normal link menus, Ctrl-click and touch scrolling.
   Interactive descendants sit above this link and retain their own actions. */
.product-miniature .product-container.product-style {
  position: relative;
  isolation: isolate;
}
.product-miniature .product-container.product-style > .dbx-card-link {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block;
  border-radius: inherit;
  background: transparent;
  cursor: pointer;
}
.product-miniature .product-container.product-style a:not(.dbx-card-link),
.product-miniature .product-container.product-style button,
.product-miniature .product-container.product-style input,
.product-miniature .product-container.product-style select,
.product-miniature .product-container.product-style textarea,
.product-miniature .product-container.product-style label,
.product-miniature .product-container.product-style [role="button"] {
  position: relative;
  z-index: 2;
}
.product-miniature .product-container.product-style .product-price-and-shipping--empty {
  visibility: hidden;
}
.product-miniature .product-container.product-style:has(.product-name a:focus-visible) {
  outline: 2px solid #ffb87e;
  outline-offset: 2px;
}

/* Preserve the status row even when the product has no availability message. */
.product-miniature .product-container.product-style .product-availability--empty {
  visibility: hidden;
}

/* Official Wishlist 4: integrated secondary card action and readable dark panels. */
/* Native Wishlist mounts a wrapper inside the card slot. Keep both
   wrappers layout-neutral so the Vue button stays in our action stack. */
.product-miniature .product-container.product-style .dbx-wishlist-native-slot,
.product-miniature .product-container.product-style .dbx-wishlist-native-slot > .wishlist-button {
  display: contents;
}
.product-miniature .product-container.product-style .buttons-sections > .wishlist-button-add,
.product-miniature .product-container.product-style .buttons-sections .dbx-wishlist-native-slot .wishlist-button-add {
  position: relative;
  inset: auto;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: 100%;
  min-width: 0;
  height: auto;
  min-height: 44px;
  padding: 8px;
  margin: 0;
  border: 1px solid #73777b;
  border-radius: 7px;
  background: #383b3e;
  color: #f0f0f0;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
  font-size: 12px;
  line-height: 1.35;
  white-space: normal;
  text-transform: none;
}
.product-miniature .product-container.product-style .wishlist-button-add i {
  color: #ff9d58;
  font-size: 19px;
  flex: 0 0 auto;
}
.product-miniature .product-container.product-style .wishlist-button-add:hover {
  opacity: 1;
  background: #45484c;
  border-color: #ff9d58;
}
.product-miniature .product-container.product-style .wishlist-button-add[aria-pressed="true"] {
  background: #49382d;
  border-color: #c78251;
}
.product-miniature .product-container.product-style .wishlist-button-add:active { transform: none; }
/* Native module buttons contain an icon only; add a short visible card label. */
.product-miniature .product-container.product-style .dbx-wishlist-native-slot .wishlist-button-add::after {
  content: "Wishlist";
  font-size: 12px;
  font-weight: 600;
}
html[lang^="de"] .product-miniature .product-container.product-style .dbx-wishlist-native-slot .wishlist-button-add::after {
  content: "Wunschliste";
}

/* Wishlist palette: selectors deliberately outrank the CSS injected by Vue. */
.wishlist-container .wishlist-list,
.wishlist-modal.modal .modal-content .wishlist-list {
  border-color: #56595c;
}
.wishlist-container .wishlist-list .wishlist-list-item,
.wishlist-modal.modal .modal-content .wishlist-list .wishlist-list-item {
  background: #303234;
  border-color: #56595c;
}
.wishlist-container .wishlist-list .wishlist-list-item:hover,
.wishlist-container .wishlist-list .wishlist-list-item:focus-within,
.wishlist-modal.modal .modal-content .wishlist-list .wishlist-list-item:hover,
.wishlist-modal.modal .modal-content .wishlist-list .wishlist-list-item:focus-within {
  background: #414448;
}
.wishlist-container .wishlist-list .wishlist-list-item .wishlist-list-item-title,
.wishlist-modal.modal .modal-content .wishlist-list .wishlist-list-item > p,
.wishlist-container .wishlist-list-empty,
.wishlist-products-container .wishlist-list-empty,
.wishlist-modal.modal .modal-content .wishlist-list-empty {
  color: var(--dbx-text);
}
.wishlist-container .wishlist-list .wishlist-list-item:hover .wishlist-list-item-title,
.wishlist-container .wishlist-list .wishlist-list-item:focus-within .wishlist-list-item-title,
.wishlist-modal.modal .modal-content .wishlist-list .wishlist-list-item:hover > p,
.wishlist-modal.modal .modal-content .wishlist-list .wishlist-list-item:focus-within > p {
  color: var(--dbx-accent);
}
.wishlist-container .wishlist-list-item-title span { color: #c5c7c9; }
.wishlist-container a.wishlist-add-to-new,
.wishlist-container a.wishlist-add-to-new:not([href]):not([tabindex]),
.wishlist-container a.wishlist-add-to-new:hover,
.wishlist-container a.wishlist-add-to-new:focus {
  background: transparent;
  background-image: none;
  box-shadow: none;
  border: 0;
  color: var(--dbx-accent) !important;
}
.wishlist-container a.wishlist-add-to-new i { color: inherit; }
.wishlist-container a.wishlist-add-to-new:hover { text-decoration: underline; }

/* Menus in the account area. */
.wishlist-container .wishlist-list-item-right > button i { color: #d4d6d8; }
.wishlist-container .wishlist-list-item-right > button:hover i { color: var(--dbx-accent); }
.wishlist-container .wishlist-list-item-right .dropdown-menu {
  background: #303234;
  border: 1px solid #686c70;
  color: var(--dbx-text);
}
.wishlist-container .wishlist-list-item-right .dropdown-menu > button {
  background: transparent;
  color: var(--dbx-text);
}
.wishlist-container .wishlist-list-item-right .dropdown-menu > button:hover,
.wishlist-container .wishlist-list-item-right .dropdown-menu > button:focus {
  background: #45484b;
  color: var(--dbx-accent);
}

/* All Wishlist dialogs: choose, create, rename, share, remove and sign in. */
.wishlist-modal.modal .modal-content {
  background: #303234;
  color: var(--dbx-text);
  border: 1px solid #686c70;
  border-radius: 10px;
}
.wishlist-modal.modal .modal-content .modal-header {
  background: #303234;
  border-color: #55595d;
  padding-right: 48px;
}
.wishlist-modal.modal .modal-content .modal-body { background: #303234; color: var(--dbx-text); }
.wishlist-modal.modal .modal-content .modal-footer { background: #292b2d; border-color: #55595d; }
.wishlist-modal.modal .modal-content .modal-title,
.wishlist-modal.modal .modal-content p,
.wishlist-modal.modal .modal-content label { color: var(--dbx-text); }
.wishlist-modal.modal .modal-content .modal-header button.close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  min-width: 32px;
  padding: 0;
  top: 8px;
  right: 8px;
  margin: 0;
  background: #414448;
  color: #fff;
  border: 1px solid #73777b;
  border-radius: 6px;
  font-size: 24px;
  line-height: 1;
  text-shadow: none;
}
.wishlist-modal.modal .modal-content .modal-header button.close span {
  color: inherit;
  background: transparent;
}
.wishlist-modal.modal .modal-content .modal-header button.close:hover,
.wishlist-modal.modal .modal-content .modal-header button.close:focus {
  background: #505458;
  color: var(--dbx-accent);
  border-color: var(--dbx-accent);
}
.wishlist-modal.modal .modal-content .form-control {
  background: #222426;
  color: #fff;
  border-color: #73777b;
}
.wishlist-modal.modal .modal-content .form-control:focus {
  border-color: var(--dbx-accent);
  box-shadow: 0 0 0 2px rgba(238,92,4,.2);
}
.wishlist-modal.modal .modal-content .btn-primary {
  background: linear-gradient(180deg,var(--dbx-accent),#c94b02);
  border-color: var(--dbx-accent);
  color: #fff;
}
.wishlist-modal.modal .modal-content .btn-primary:hover,
.wishlist-modal.modal .modal-content .btn-primary:focus {
  background: var(--dbx-accent);
  border-color: var(--dbx-accent);
  color: #fff;
}
.wishlist-modal.modal .modal-content .btn-primary i { color: inherit; }
.wishlist-modal.modal .modal-content .modal-footer .modal-cancel.btn.btn-secondary {
  background: #414448;
  border-color: #73777b;
  color: var(--dbx-text);
}
.wishlist-modal.modal .modal-content .modal-footer .modal-cancel.btn.btn-secondary:hover,
.wishlist-modal.modal .modal-content .modal-footer .modal-cancel.btn.btn-secondary:focus {
  background: #505458;
  color: #fff;
}

/* The module's product cards and its empty state. */
.wishlist-products-container .wishlist-products-list {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.wishlist-products-container .wishlist-products-item {
  margin: 0;
  padding: 14px;
  background: linear-gradient(155deg,#36383a,#292b2d);
  border: 1px solid #5a5e62;
  border-radius: 10px;
  box-shadow: var(--dbx-shadow);
}
.wishlist-products-container .wishlist-product .wishlist-product-title,
.wishlist-products-container .wishlist-product .wishlist-product-combinations-text,
.wishlist-products-container .wishlist-product .wishlist-product-availability { color: var(--dbx-text); }
.wishlist-products-container .wishlist-product .wishlist-product-title { line-height: 1.45; }
.wishlist-products-container .wishlist-product-link:hover .wishlist-product-title,
.wishlist-products-container .wishlist-product-combinations a:hover { color: var(--dbx-accent); }
.wishlist-products-container .wishlist-product .wishlist-product-price { color: var(--dbx-accent-light); font-size: 21px; }
.wishlist-products-container .wishlist-products-count { color: #c5c7c9; }
.wishlist-products-container .wishlist-product-image { background: #222; border-radius: 7px; }
.wishlist-products-container .wishlist-product .wishlist-product-availability {
  background: #303234;
  padding: 4px 6px;
  border-radius: 5px;
}
.wishlist-products-container .wishlist-product-combinations { margin: 10px 0; }
.wishlist-products-container .wishlist-product-combinations a { color: #d4d6d8; }
.wishlist-products-container .wishlist-product-addtocart { min-height: 44px; border-radius: 7px; }
.wishlist-products-container .wishlist-pagination .js-search-link:hover { color: var(--dbx-accent); }

/* The return links are outside the Vue container on the details page. */
body .wishlist-footer-links {
  background: #303234;
  color: var(--dbx-text);
  border: 1px solid #62666a;
  border-radius: 8px;
}
body .wishlist-footer-links > a { color: var(--dbx-text) !important; background: transparent; }
body .wishlist-footer-links > a:hover,
body .wishlist-footer-links > a:focus { color: var(--dbx-accent) !important; background: transparent; }

/* Product page: buy row is explicit in the Dev TPL, so the standard hook
   does not need layout tricks or assumptions about unrelated module output. */
.main-product-details .dbx-pdp-purchase-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(170px, 28%);
  gap: 12px;
  width: 100%;
  min-width: 0;
  align-items: stretch;
}
.main-product-details .dbx-pdp-purchase-row > .qty-add-row {
  width: 100%;
  min-width: 0;
}
.main-product-details .dbx-pdp-wishlist-slot,
.main-product-details .dbx-pdp-wishlist-slot .wishlist-button {
  display: flex;
  align-items: stretch;
  width: 100%;
  min-width: 0;
}
.main-product-details .dbx-pdp-wishlist-slot .wishlist-button-product {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
  min-height: 46px;
  height: auto;
  margin: 0;
  padding: 10px 12px;
  border: 1px solid #777b7e;
  border-radius: var(--dbx-button-radius, 7px);
  background: linear-gradient(180deg, #45484b, #34373a);
  color: var(--dbx-text);
  box-shadow: var(--dbx-button-shadow, inset 0 1px 0 rgba(255,255,255,.12), 0 2px 4px rgba(0,0,0,.18));
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  text-transform: none;
  white-space: normal;
  transition: filter .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.main-product-details .dbx-pdp-wishlist-slot .wishlist-button-product i {
  color: var(--dbx-accent-light);
  flex: 0 0 auto;
}
/* The unmodified official Wishlist button renders only a heart icon. */
.main-product-details .dbx-pdp-wishlist-slot .wishlist-button-product::after {
  content: "Wishlist";
  font-size: 13px;
  font-weight: 600;
}
html[lang^="de"] .main-product-details .dbx-pdp-wishlist-slot .wishlist-button-product::after {
  content: "Wunschliste";
}
.main-product-details .dbx-pdp-wishlist-slot .wishlist-button-product:is(:hover,:focus-visible) {
  filter: brightness(1.11);
  border-color: #aaaeb1;
  color: #fff;
  box-shadow: var(--dbx-button-shadow-hover, 0 4px 9px rgba(0,0,0,.28));
}
/* Mobile PDP: status and wishlist line up with the orange cart in the
   right-hand action column. Quantity stays on the left only at cart height. */
@media (max-width: 991.98px) {
  .main-product-details {
    --dbx-pdp-qty-column: 104px;
    --dbx-pdp-action-gap: 12px;
  }
  .main-product-details .dbx-pdp-purchase-row {
    display: grid;
    grid-template-columns: var(--dbx-pdp-qty-column) minmax(0, 1fr);
    column-gap: var(--dbx-pdp-action-gap);
    row-gap: 9px;
    width: 100%;
    min-width: 0;
    align-items: stretch;
  }
  .main-product-details .dbx-pdp-purchase-row > .qty-add-row {
    grid-column: 1 / -1;
    grid-row: 1;
    width: 100%;
    min-width: 0;
    gap: var(--dbx-pdp-action-gap) !important;
  }
  .main-product-details .dbx-pdp-purchase-row > .qty-add-row > .product-quantity-touchspin {
    flex: 0 0 var(--dbx-pdp-qty-column) !important;
    width: var(--dbx-pdp-qty-column);
    max-width: var(--dbx-pdp-qty-column) !important;
    min-width: 0;
  }
  .main-product-details .dbx-pdp-purchase-row > .qty-add-row > .add {
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0;
  }
  .main-product-details .dbx-pdp-purchase-row > .dbx-pdp-wishlist-slot {
    grid-column: 2;
    grid-row: 2;
    width: 100%;
    min-width: 0;
  }
  .main-product-details .dbx-pdp-wishlist-slot .wishlist-button {
    justify-content: stretch;
    width: 100%;
  }
  .main-product-details .dbx-pdp-wishlist-slot .wishlist-button-product {
    width: 100%;
    min-width: 0;
    min-height: 44px;
    height: auto;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid #787c80;
    border-radius: var(--dbx-button-radius, 7px);
    background: linear-gradient(180deg, #414548, #34373a);
    color: #f2f2f2;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 2px 4px rgba(0,0,0,.15);
  }
  .main-product-details .dbx-pdp-wishlist-slot .wishlist-button-product:is(:hover,:focus-visible) {
    background: linear-gradient(180deg, #50565a, #3a3e42);
    border-color: #a9adb0;
    color: #fff;
    box-shadow: var(--dbx-button-shadow-hover, 0 4px 9px rgba(0,0,0,.28));
  }
}
/* At the narrowest phone widths keep the purchase CTA from being squeezed. */
@media (max-width: 359.98px) {
  .main-product-details {
    --dbx-pdp-qty-column: 92px;
    --dbx-pdp-action-gap: 8px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .main-product-details .dbx-pdp-wishlist-slot .wishlist-button-product {
    transition: none;
  }
}
.wishlist-container a:focus-visible,
.wishlist-container button:focus-visible,
.wishlist-modal.modal .modal-content button:focus-visible,
#product .wishlist-button-product:focus-visible {
  outline: 2px solid var(--dbx-accent);
  outline-offset: 2px;
}

/* DragonBox ThemeDev: common raised button appearance.
   Deliberately scoped to standard .btn color variants. Keep custom payment SDK,
   card notification, wishlist, and sticky PDP actions in their own components. */

:root {
  --dbx-button-radius: 7px;
  --dbx-button-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 2px 4px rgba(0,0,0,.18);
  --dbx-button-shadow-hover: inset 0 1px 0 rgba(255,255,255,.22), 0 4px 9px rgba(0,0,0,.28);
}

/* Exact same two-tone orange used by the new miniature buy button. */
body .btn.btn-primary {
  --dbx-button-from: #f87418;
  --dbx-button-to: #cf4c00;
  --dbx-button-border: #f8873c;
  --dbx-button-text: #fff;
}

/* Keep existing semantic color distinctions, but give them equal depth. */
body .btn.btn-secondary {
  --dbx-button-from: #56813b;
  --dbx-button-to: #385d2a;
  --dbx-button-border: #93b46f;
  --dbx-button-text: #fff;
}
body .btn.btn-success {
  --dbx-button-from: #298c59;
  --dbx-button-to: #176740;
  --dbx-button-border: #48a775;
  --dbx-button-text: #fff;
}
body .btn.btn-danger {
  --dbx-button-from: #d85552;
  --dbx-button-to: #a93231;
  --dbx-button-border: #ee7771;
  --dbx-button-text: #fff;
}
body .btn.btn-warning {
  --dbx-button-from: #ffc15a;
  --dbx-button-to: #d79025;
  --dbx-button-border: #ffd17c;
  --dbx-button-text: #261602;
}
body .btn.btn-info {
  --dbx-button-from: #328ab8;
  --dbx-button-to: #20618c;
  --dbx-button-border: #61a7cd;
  --dbx-button-text: #fff;
}

/* Standard theme buttons only. Do not change square icon buttons, carts in the
   header, marketplace-brand CTAs or the white on-orange mobile sticky CTA. */
body .btn:is(.btn-primary,.btn-secondary,.btn-success,.btn-danger,.btn-warning,.btn-info):not(.pdp-sticky-cta__btn):not(.cart-link):not(.dbxpd-notify__toggle):not(.wishlist-button-add):not(.wishlist-button-product) {
  border: 1px solid var(--dbx-button-border);
  border-radius: var(--dbx-button-radius);
  background: linear-gradient(180deg, var(--dbx-button-from), var(--dbx-button-to));
  color: var(--dbx-button-text);
  box-shadow: var(--dbx-button-shadow);
  text-decoration: none;
  transition: filter .16s ease, box-shadow .16s ease, transform .16s ease;
}
body .btn:is(.btn-primary,.btn-secondary,.btn-success,.btn-danger,.btn-warning,.btn-info):not(.pdp-sticky-cta__btn):not(.cart-link):not(.dbxpd-notify__toggle):not(.wishlist-button-add):not(.wishlist-button-product):is(:hover,:focus-visible):not(:disabled):not(.disabled) {
  filter: brightness(1.10) saturate(1.04);
  color: var(--dbx-button-text);
  border-color: var(--dbx-button-border);
  box-shadow: var(--dbx-button-shadow-hover);
  text-decoration: none;
}
body .btn:is(.btn-primary,.btn-secondary,.btn-success,.btn-danger,.btn-warning,.btn-info):not(.pdp-sticky-cta__btn):not(.cart-link):not(.dbxpd-notify__toggle):not(.wishlist-button-add):not(.wishlist-button-product):active:not(:disabled):not(.disabled) {
  filter: brightness(.94);
  transform: translateY(1px);
  box-shadow: inset 0 1px 4px rgba(0,0,0,.25), 0 1px 2px rgba(0,0,0,.15);
}
body .btn:is(.btn-primary,.btn-secondary,.btn-success,.btn-danger,.btn-warning,.btn-info):focus-visible {
  outline: 2px solid #ffc49b;
  outline-offset: 2px;
}
body .btn:is(.btn-primary,.btn-secondary,.btn-success,.btn-danger,.btn-warning,.btn-info):is(:disabled,.disabled,[aria-disabled="true"]) {
  filter: saturate(.55);
  opacity: .55;
  cursor: not-allowed;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

/* Wishlist modal buttons have a higher-specificity legacy override.
   Align their primary action too without changing its modal markup. */
.wishlist-modal.modal .modal-content .btn.btn-primary {
  background: linear-gradient(180deg, #f87418, #cf4c00);
  border-color: #f8873c;
  color: #fff;
  border-radius: var(--dbx-button-radius);
  box-shadow: var(--dbx-button-shadow);
}
.wishlist-modal.modal .modal-content .btn.btn-primary:is(:hover,:focus-visible) {
  background: linear-gradient(180deg, #ff8a32, #e65c08);
  border-color: #ff9e62;
  color: #fff;
  box-shadow: var(--dbx-button-shadow-hover);
}

@media (prefers-reduced-motion: reduce) {
  body .btn:is(.btn-primary,.btn-secondary,.btn-success,.btn-danger,.btn-warning,.btn-info) {
    transition: none;
  }
}


/* DragonBox ThemeDev: harmonious sidebar panels + message surfaces.
   Design only: ps_emailsubscription and blog logic/templates are untouched. */
:root {
  --dbx-panel-orange-top: #fa7622;
  --dbx-panel-orange-bottom: #d65105;
  --dbx-panel-orange-border: #ff9854;
  --dbx-panel-green-top: #355238;
  --dbx-panel-green-bottom: #263e2b;
  --dbx-panel-green-border: #638a64;
  --dbx-panel-info-top: #38443b;
  --dbx-panel-info-bottom: #2b3530;
  --dbx-panel-info-border: #637769;
}

/* Shared orange headings: keep the established visual navigation,
   but replace the flat orange background with a restrained raised finish. */
body .block-title {
  text-align: center;
  background: linear-gradient(180deg, var(--dbx-panel-orange-top) 0%, #ee620e 48%, var(--dbx-panel-orange-bottom) 100%);
  border: 1px solid var(--dbx-panel-orange-border);
  border-radius: 8px;
  padding: 7px 11px;
  color: #fff;
  text-shadow: 0 1px 1px rgba(87,27,0,.34);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    0 2px 5px rgba(0,0,0,.23);
}
body .block-title a,
body .block-title a:hover,
body .block-title a:focus {
  color: #fff;
}

/* Consistent dark panels for shop news and both PrestaShop newsletter layouts.
   Scope to the sidebar, not identical class names in checkout or footer. */
:is(#left-column,#right-column) :is(#blog_for_prestashop_column, .block_newsletter, .block-newsletter) {
  box-sizing: border-box;
  min-width: 0;
  padding: 9px 9px 12px;
  margin-bottom: 16px;
  background: linear-gradient(155deg, #3b3d3f 0%, #303234 100%);
  border: 1px solid var(--dbx-border);
  border-radius: var(--dbx-radius);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035), var(--dbx-shadow);
}
:is(#left-column,#right-column) :is(#blog_for_prestashop_column, .block_newsletter, .block-newsletter) > .block-title {
  margin: 0 0 10px;
}
/* Images now sit comfortably inside the matching panel surfaces. */
:is(#left-column,#right-column) #blog_for_prestashop_column .products-block-image,
:is(#left-column,#right-column) #blog_for_prestashop_column .products-block-image img,
:is(#left-column,#right-column) .block_newsletter > img {
  border-radius: 6px;
}
:is(#left-column,#right-column) .block_newsletter > img {
  display: block;
  max-width: 100%;
  width: 100%;
  height: auto;
  margin: 0 0 10px;
}
/* The legacy column newsletter uses Bootstrap .row negative gutters. */
:is(#left-column,#right-column) .block_newsletter > .row {
  margin-left: 0;
  margin-right: 0;
}
:is(#left-column,#right-column) .block_newsletter > .row > [class*="col-"] {
  padding-left: 0;
  padding-right: 0;
}
/* Remove only the blog widget's now-redundant separator.
   The new panel border supplies the separation. */
:is(#left-column,#right-column) #blog_for_prestashop_column + hr {
  display: none;
}

/* Success feedback is a status surface, not another big green CTA.
   The original #005500 background from custom.css is intentionally replaced. */
body .alert.alert-success {
  background: linear-gradient(180deg, var(--dbx-panel-green-top), var(--dbx-panel-green-bottom));
  background-color: var(--dbx-panel-green-bottom);
  border: 1px solid var(--dbx-panel-green-border);
  border-radius: 8px;
  color: #ecf5eb;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 2px 5px rgba(0,0,0,.15);
  padding: 11px 13px;
  line-height: 1.45;
}
/* Informational alerts get an even quieter related tint. */
body .alert.alert-info {
  background: linear-gradient(180deg, var(--dbx-panel-info-top), var(--dbx-panel-info-bottom));
  background-color: var(--dbx-panel-info-bottom);
  border: 1px solid var(--dbx-panel-info-border);
  border-radius: 8px;
  color: #e5efe8;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 2px 5px rgba(0,0,0,.13);
  padding: 11px 13px;
  line-height: 1.45;
}
:is(#left-column,#right-column) :is(.block_newsletter,.block-newsletter) .alert {
  margin: 10px 0 12px;
}


/* Withdrawal and PDP use btn-primary in their Dev TPLs.
   Keep the functional custom classes, but let our shared button rules style
   them automatically. The module's own footer selector must not win on hover. */
body a.btn.btn-primary.orderwithdrawl-footer-button,
body .main-product-details button.btn.btn-primary.add-to-cart {
  border-radius: var(--dbx-button-radius, 7px);
  background: linear-gradient(180deg, var(--dbx-button-from), var(--dbx-button-to));
  border: 1px solid var(--dbx-button-border);
  box-shadow: var(--dbx-button-shadow);
  color: var(--dbx-button-text);
}
body a.btn.btn-primary.orderwithdrawl-footer-button:is(:hover,:focus-visible),
body .main-product-details button.btn.btn-primary.add-to-cart:is(:hover,:focus-visible):not(:disabled) {
  filter: brightness(1.10);
  box-shadow: var(--dbx-button-shadow-hover);
  color: var(--dbx-button-text);
}

/* Product sheet: stock status and shipping belong to the price, not the
   purchase actions. Same layout on desktop and mobile. */
#product .main-product-details .dbx-pdp-fulfillment {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  margin: 11px 0 18px;
  min-width: 0;
}
#product .main-product-details .dbx-pdp-stock-status {
  flex: 0 0 auto;
  max-width: 100%;
}
#product .main-product-details .dbx-pdp-stock-status:empty {
  display: none;
}
#product .main-product-details .dbx-pdp-stock-label {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  padding: 4px 0;
  background: transparent;
  border: none;
  color: #e3e5e7;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  white-space: normal;
}
#product .main-product-details .dbx-pdp-stock-label i {
  color: #89c994;
  font-size: 18px;
  line-height: 1;
}
#product .main-product-details .dbx-pdp-stock-label--available {
  color: #daf2de;
}
#product .main-product-details .dbx-pdp-stock-label--available i {
  color: #8ed29a;
}
#product .main-product-details .dbx-pdp-stock-label--unavailable i {
  color: #ee7771;
}
#product .main-product-details .dbx-pdp-stock-label--available:not(:first-child) {
  margin: 0;
}
#product .main-product-details .dbx-pdp-fulfillment > .shipping-delivery-label {
  flex: 0 1 auto;
  min-width: 0;
  margin: 0;
  color: #d1d4d6;
  font-size: 13px;
}
#product .main-product-details .dbx-pdp-fulfillment .delivery-information {
  margin: 0;
}

/* Specs from the former header table are now displayed once, alongside the
   original feature grid in the existing Data sheet. Keep the source class
   for Z.One quickview's built-in metadata-copy mechanism. */
#product .main-product-bottom .dbx-pdp-product-specs {
  display: grid;
  gap: 10px 12px;
  margin: 0 0 10px;
}
#product .main-product-bottom .dbx-pdp-product-specs > .attribute-item:not(.d-none) {
  display: grid;
  grid-template-columns: minmax(100px, 1fr) minmax(0, 1.65fr);
  gap: 10px;
  align-items: start;
  padding: 10px 12px;
  border-radius: 5px;
  background: #414447;
  border: 1px solid #505458;
  min-width: 0;
}
#product .main-product-bottom .dbx-pdp-product-specs .attribute-item label {
  margin: 0;
  color: #d4d7d9;
  font-weight: 600;
}
#product .main-product-bottom .dbx-pdp-product-specs .attribute-item :is(span,a) {
  color: #f0f1f2;
  overflow-wrap: anywhere;
}
#product .main-product-bottom .dbx-pdp-product-specs .attribute-item a {
  color: var(--dbx-accent-light);
}
#product .main-product-bottom .dbx-pdp-product-specs .brand-logo,
#product .main-product-bottom .dbx-pdp-product-specs .product-quantities {
  display: none !important;
}
@media (max-width: 575.98px) {
  #product .main-product-details .dbx-pdp-fulfillment {
    gap: 4px 12px;
  }
  #product .main-product-bottom .dbx-pdp-product-specs > .attribute-item:not(.d-none) {
    grid-template-columns: minmax(88px, .95fr) minmax(0, 1.7fr);
    padding: 9px 10px;
    gap: 8px;
  }
}


/* Full Data sheet: retain the original grouped product features alongside
   manufacturer, reference and other specification rows. */
#product .main-product-bottom .dbx-pdp-tech-features {
  display: grid;
  gap: 10px 12px;
  margin: 0;
  padding: 0;
  width: 100%;
  min-width: 0;
}
#product .main-product-bottom .dbx-pdp-tech-features > .dbx-pdp-tech-feature-row {
  display: grid;
  grid-template-columns: minmax(100px, 1fr) minmax(0, 1.65fr);
  align-items: start;
  gap: 10px;
  min-width: 0;
  padding: 10px 12px;
  border-radius: 5px;
  border: 1px solid #505458;
  background: #414447;
}
#product .main-product-bottom .dbx-pdp-tech-feature-row :is(dt,dd) {
  margin: 0;
  padding: 0;
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: 14px;
  line-height: 1.5;
}
#product .main-product-bottom .dbx-pdp-tech-feature-row dt {
  color: #d4d7d9;
  font-weight: 600;
}
#product .main-product-bottom .dbx-pdp-tech-feature-row dd {
  color: #f0f1f2;
}
@media (max-width: 575.98px) {
  #product .main-product-bottom .dbx-pdp-tech-features > .dbx-pdp-tech-feature-row {
    grid-template-columns: minmax(88px, .95fr) minmax(0, 1.7fr);
    padding: 9px 10px;
    gap: 8px;
  }
}

/* Data sheet: desktop is one calm panel, not a wall of individual boxes.
   Keep the original framed label/value rows on phones below 768px.
   Metadata uses equal flexible widths; feature columns leave the final row
   naturally incomplete instead of stretching two entries across the panel. */
@media (min-width: 768px) {
  #product .main-product-bottom .dbx-pdp-product-specs {
    display: flex;
    flex-wrap: wrap;
    gap: 16px 24px;
    margin: 0 0 18px;
    padding: 2px 0 18px;
    border-bottom: 1px solid rgba(255, 255, 255, .14);
  }
  #product .main-product-bottom .dbx-pdp-tech-features {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 30px;
    margin: 0;
    padding: 0 0 4px;
  }
  #product .main-product-bottom .dbx-pdp-product-specs > .attribute-item:not(.d-none),
  #product .main-product-bottom .dbx-pdp-tech-features > .dbx-pdp-tech-feature-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-content: start;
    gap: 5px;
    min-width: 0;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }
  #product .main-product-bottom .dbx-pdp-product-specs > .attribute-item:not(.d-none) {
    flex: 1 1 calc((100% - 24px) / 2);
  }
  #product .main-product-bottom .dbx-pdp-product-specs .attribute-item > label,
  #product .main-product-bottom .dbx-pdp-tech-feature-row > dt {
    text-align: left;
    color: #aeb4b8;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: .015em;
  }
}
@media (min-width: 1200px) {
  #product .main-product-bottom .dbx-pdp-product-specs {
    flex-wrap: nowrap;
  }
  #product .main-product-bottom .dbx-pdp-product-specs > .attribute-item:not(.d-none) {
    flex: 1 1 0;
  }
  #product .main-product-bottom .dbx-pdp-tech-features {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* Product intro: a calmer typographic hierarchy on desktop, while retaining
   the existing mobile header/logo layout and short-description spacing. */
@media (min-width: 992px) {
  #product .main-product-details #product-name-brand {
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid rgba(255,255,255,.12);
  }
  #product .main-product-details #product-name .page-heading {
    line-height: 1.28;
    letter-spacing: -.2px;
  }
  #product .main-product-details .product-description-short {
    margin: 0 0 24px;
    padding: 8px 18px;
    border-left: 3px solid #dc651e;
    border-radius: 0 6px 6px 0;
    background: linear-gradient(90deg, rgba(240,111,31,.065), rgba(240,111,31,0) 78%);
    color: #e7e9ea;
    font-size: 14px;
    line-height: 1.65;
  }
  #product .main-product-details .product-description-short :is(p,ul,ol) {
    margin-bottom: 9px;
  }
  #product .main-product-details .product-description-short :is(p,ul,ol):last-child {
    margin-bottom: 0;
  }
}