/* Donor compare structure; presentation scoped to the Joomla override. */
.pm-compare { margin: 24px auto 48px; width: 100%; max-width: 100%; }
.pm-compare [hidden] { display: none !important; }
.pm-compare .compare-sections__tabs { overflow-x: auto; margin-bottom: 24px; }
.pm-compare .compare-sections__tabs .nav { display: flex; flex-wrap: nowrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.pm-compare .compare-sections__tab-item { flex: 0 0 auto; border: 1px solid var(--stroke_black, #e5e5e5); border-radius: 4px; }
.pm-compare .compare-sections__tab-item button { display: flex; align-items: center; gap: 8px; padding: 12px 16px; color: inherit; background: transparent; border: 0; cursor: pointer; font: inherit; }
.pm-compare .compare-sections__tab-item.active { border-color: var(--theme-base-color, #ff8a00); }
.pm-compare .compare-sections__tab-item.active button { color: var(--theme-base-color, #ff8a00); }
.pm-compare .compare-sections__tab-count { min-width: 20px; border-radius: 4px; padding: 0 5px; background: var(--darkerblack_bg_black, #f4f4f4); font-size: 12px; text-align: center; }
.pm-compare .catalog-compare__top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 24px; }
.pm-compare .catalog-compare__clear { background: none; border: 0; cursor: pointer; font: inherit; color: var(--secondary-color, #888); padding: 0; }
.pm-compare .catalog-compare__clear:hover { color: var(--theme-base-color, #ff8a00); }
.pm-compare button:disabled { opacity: .4; cursor: default; }
.pm-compare .swiper { overflow: hidden; }
.pm-compare .swiper-wrapper { display: flex; box-sizing: content-box; }
.pm-compare .swiper-slide { flex-shrink: 0; position: relative; width: 50%; }
.pm-compare .catalog-compare__items .swiper-wrapper { align-items: stretch; }
.pm-compare .pm-rm-card { width: 100%; height: 100%; margin: 0; }
.pm-compare .pm-compare-product { height: auto; }
.pm-compare .pm-compare-remove { position: absolute; z-index: 5; top: 8px; left: 8px; border: 0; border-radius: 50%; background: var(--black_bg_white, #fff); color: var(--secondary-color, #888); width: 30px; height: 30px; cursor: pointer; font-size: 24px; }
.pm-compare .catalog-compare__props-slider { margin-top: 24px; }
.pm-compare .catalog-compare__prop-line { position: relative; padding: 16px; border-bottom: 1px solid var(--stroke_black, #e5e5e5); box-sizing: border-box; }
.pm-compare .catalog-compare__prop-name { display: block; padding-right: 16px; margin-bottom: 4px; }
.pm-compare .catalog-compare__prop-value { display: block; overflow-wrap: anywhere; }
.pm-compare .pm-compare-hide-row { position: absolute; top: 12px; right: 6px; background: none; color: var(--secondary-color, #888); border: 0; font-size: 18px; cursor: pointer; }
.pm-compare .pm-compare-message { color: #b42318; margin-top: 16px; }
.pm-compare button:focus-visible { outline: 2px solid var(--theme-base-color, #ff8a00); outline-offset: 3px; }
.pm-compare[aria-busy] .catalog-compare { opacity: .6; pointer-events: none; }
@media(max-width: 600px) { .pm-compare .catalog-compare__top { align-items: flex-start; } .pm-compare .catalog-compare__prop-line { padding: 12px 8px; } .pm-compare .compare-sections__tab-item button { padding: 10px 12px; } }

.pm-compare .swiper-wrapper { position: relative; width: 100%; z-index: 1; transition-property: transform; transition-timing-function: ease; }
.pm-compare .swiper-slide { transition-property: transform; }
.pm-compare .swiper { touch-action: pan-y; }
.pm-compare [data-show-cart="0"] .catalog-block__info-bottom { display: none; }
.pm-compare [data-show-stock="0"] .status-container { display: none; }

.pm-compare .compare-sections__tabs { scrollbar-width: none; }
.pm-compare .compare-sections__tabs::-webkit-scrollbar { display: none; }
.pm-compare .catalog-compare__switch { position: relative; }
.pm-compare #compare_diff { position: absolute; opacity: 0; width: 32px; height: 20px; margin: 0; }
.pm-compare .catalog-compare__switch label { position: relative; display: inline-block; padding-left: 44px; cursor: pointer; line-height: 20px; }
.pm-compare .catalog-compare__switch label::before { content: ''; position: absolute; left: 0; top: 0; width: 32px; height: 20px; border-radius: 10px; background: #b8b8b9; transition: background .2s; }
.pm-compare .catalog-compare__switch label::after { content: ''; position: absolute; left: 2px; top: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform .2s; }
.pm-compare #compare_diff:checked + label::before { background: var(--theme-base-color, #ff8a00); }
.pm-compare #compare_diff:checked + label::after { transform: translateX(12px); }
.pm-compare #compare_diff:focus-visible + label { outline: 2px solid var(--theme-base-color, #ff8a00); outline-offset: 3px; }
.pm-compare .pm-compare-remove svg { display: block; width: 20px; height: 20px; margin: auto; }

.pm-compare [data-show-price="0"] .price, .pm-compare [data-show-price="0"] [data-pm-total] { display: none; }

/* Base donor CSS loads after component assets; keep tab frames and intrinsic width. */
.pm-compare .compare-sections__tabs .nav.nav-tabs { min-width: 0; width: max-content; }
.pm-compare .compare-sections__tabs .nav-tabs .compare-sections__tab-item { border: 1px solid var(--stroke_black, #e5e5e5); }
.pm-compare .compare-sections__tabs .nav-tabs .compare-sections__tab-item.active { border-color: var(--theme-base-color, #ff8a00); }

/* Before deferred Swiper initialization, use the same responsive card widths. */

/* Keep the shared quantity/cart controls at the same usable card width as catalog tiles. */
.pm-compare .swiper-slide { width: 330px; max-width: calc(100% - 20px); }
