/* ====================================================================
   PRODUCT COMPARISON PAGE - FIGMA PERFECT MATCH
   ====================================================================
   
   ⚠️  IMPORTANT: This CSS file ONLY affects the Product Comparison page
   ⚠️  Header, Footer, Navigation - COMPLETELY UNTOUCHED
   ⚠️  All styles are scoped with .page-template-template-product-comparision
   
   Features:
   - Pixel-perfect Figma design implementation
   - Absolute positioning layout (1440px width)
   - Brand filtering with visual states
   - Product cards with feature comparison grid
   - Sticky bottom section for selected products
   - Modal system for compatibility information
   - Mobile responsive (single card + sticky section)
   - Complete isolation from global WordPress styles
   
   ==================================================================== */

/* Isolate the comparison wrapper - completely contained */
.page-template-template-product-comparision .product-comparison-wrapper {
  font-family: 'Inter', sans-serif;
  background: #FFFFFF;
  position: relative;
  z-index: 1;
  contain: layout style; /* CSS containment to prevent any spillover */
  /* overflow: hidden; */
}

/* Container - scoped to product comparison only */
.page-template-template-product-comparision .product-comparison-main .container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0;
  width: 100%;
  position: relative;
}

/* Hide default sections */
.page-template-template-product-comparision .compatible-brands-filter,
.page-template-template-product-comparision .selected-products-filter,
.page-template-template-product-comparision .parameter-filter-section,
.page-template-template-product-comparision .product-search-section {
  display: none !important;
}

/* Main comparison section */
.page-template-template-product-comparision .product-comparison-main {
  padding: 0;
  margin: 0;
  background: #FFFFFF;
}

.page-template-template-product-comparision .comparison-grid {
  display: flex !important;
  width: 1440px;
  margin: 0 auto;
  position: relative;
  background: #FFFFFF;
  /* overflow: hidden; */
  box-sizing: border-box;
  height: 1250px;
}

/* Brand filter section - top left */
.page-template-template-product-comparision .brand-filter-section {
  left: 100px;
  top: 113px;
  width: 221px;
  height: 50px;
  background: #D9D9D9;
  border-radius: 6px;
  z-index: 3;
}

.page-template-template-product-comparision .compatible-with-header {
  display: flex;
  align-items: center;
  gap: 6px;
  z-index: 4;
  justify-content: left;
  height: 50px;
  text-indent: 15px;
}

.page-template-template-product-comparision .compatible-with-text {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 17px;
  color: #1E1E1E;
  margin: 0;
}

.page-template-template-product-comparision .compatible-filter-icon {
  width: 16px;
  height: 18px;
}

/* Brand filter tags */
.page-template-template-product-comparision .brand-filter-tags {
  position: absolute;
  width: 221px;
  display: flex;
  flex-direction: column;
  gap: 3px;
  z-index: 3;
}

.page-template-template-product-comparision .brand-tag {
  width: 221px;
  height: 33px;
  border: 1px solid #BEBEBE;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: left;
  cursor: pointer;
  transition: all 0.2s ease;
  text-indent: 15px;
}

.page-template-template-product-comparision .brand-tag-text {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 17px;
  color: #1E1E1E;
  margin: 0;
}

.page-template-template-product-comparision .brand-tag:hover {
  background: #EEEEEE;
}

.page-template-template-product-comparision .brand-tag.active {
  border: 1px solid #000000;
}

/* Reset filter button */
.page-template-template-product-comparision .reset-filter-main {
  position: absolute;
  top: 360px;
  width: 221px;
  height: 33px;
  color: #F56721;
  border-radius: 6px;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 3;
  border: 1px solid #F56721;
  background: #FFFFFF;
}

.page-template-template-product-comparision .reset-filter-text {
  font-family: Matritsa, sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 17px;
  color: #F56721;
  margin: 0;
}

/* Bottom reset filter section */
.page-template-template-product-comparision .bottom-reset-section {
  display: flex;
  justify-content: flex-end;
  margin-top: 16px;
  margin-bottom: 40px;
  right: 4.4%;
  position: relative;
}

.page-template-template-product-comparision .reset-filter-bottom {
  width: 221px;
  height: 33px;
  background: transparent;
  border-radius: 6px;
  border: 1px solid #EF6526;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.2s ease;
  color: #EF6526;
}

.page-template-template-product-comparision .reset-filter-bottom:hover {
  background: #B5582A;
  color: #ffffff;
}

.page-template-template-product-comparision .reset-filter-bottom:hover .reset-filter-text {
  color: #FFFFFF;
}

/* Features column */
.page-template-template-product-comparision .features-column {
  position: absolute;
  top: 494px;
  width: 221px;
  display: flex;
  flex-direction: column;
  gap: 3px;
  z-index: 2;
}

.page-template-template-product-comparision .feature-item {
  width: 221px;
  height: 33px;
  display: flex;
  align-items: center;
  justify-content: left;
  position: relative;
  border-bottom: 1px solid #999999;
}
.page-template-template-product-comparision .feature-item:first-child{
  border-top: 1px solid #999999;
}
.page-template-template-product-comparision .feature-text {
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 17px;
  color: #1E1E1E;
  margin: 0;
}

/* Product cards container */
.page-template-template-product-comparision .product-cards-row {
  position: relative;
  width: 1100px;
  margin: auto;
  left: 110px;
  /* overflow: hidden; */
}
@media screen and (max-width:767px) {
  .page-template-template-product-comparision .product-cards-row {
    width: 260px;
    left: 0px;
    margin-left: 40%;
    transform: scale(1.4);
    top: 245px;
  }
  .page-template-template-product-comparision .product-card{
    height: 1235px;
  }
  .page-template-template-product-comparision .nav-arrow-right {
    left: 710px !important;
  }
  .page-template-template-product-comparision .comparison-grid{
    width: 1100px;
  }
  .page-template-template-product-comparision .brand-filter-tags,
  .page-template-template-product-comparision .reset-filter-main,
  .page-template-template-product-comparision .features-column{
    left: 70px;
  }
.page-template-template-product-comparision .comparison-grid {
  min-height: 1220px;
  height: 1220px;
}
.page-template-template-product-comparision .features-column{
  top: 820px;
  transform: scale(1.4);
}
body.page-template-template-product-comparision .close-product-compare{
  right: 30px;
}
.page-template-template-product-comparision .bottom-reset-section {
  margin: 10px 10px 50px auto;
  position: relative;
  bottom: 340px;
}
}
/* Individual product cards */
.page-template-template-product-comparision .product-card {
  position: relative;
  width: 260px;
  height: 1228px;
  border-radius: 6px;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  border: 1px solid #000000;
}

/* Product card positions */
/* .page-template-template-product-comparision .product-card:nth-child(1) {
  left: 0px;
  top: 113px;
}

.page-template-template-product-comparision .product-card:nth-child(2) {
  left: 236px;
  top: 113px;
}

.page-template-template-product-comparision .product-card:nth-child(3) {
  left: 472px;
  top: 113px;
}

.page-template-template-product-comparision .product-card:nth-child(4) {
  left: 708px;
  top: 113px;
} */

/* Product image */
.page-template-template-product-comparision .product-image-large {
  /* position: absolute; */
  left: 10px;
  top: 10px;
  width: 240px;
  height: 204px;
  /* background: #D9D9D9; */
  border-radius: 0;
  object-fit: cover;
  padding: 10px;
}

/* Product info section - only within product cards */
.page-template-template-product-comparision .product-card .product-info-section {
  position: relative;
  left: 10px;
  padding: 5px;
  width: 240px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.page-template-template-product-comparision .product-card .product-title {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 19px;
  color: #1E1E1E;
  margin: 0;
}

.page-template-template-product-comparision .product-card .product-price {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 19px;
  color: #1E1E1E;
  margin: 0;
}

/* Compatibility section */
.page-template-template-product-comparision .type-section {
  position: relative;
  padding:10px 15px;
  width: auto;
  display: flex;
  flex-direction: column;
  gap: 14px;
  font-size: 14px;
  height: 220px;
}

.page-template-template-product-comparision .compatibility-brand {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

/* .page-template-template-product-comparision .product-card .brand-name {
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 17px;
  color: #1E1E1E;
  margin: 0;
}

.page-template-template-product-comparision .product-card .brand-models {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 17px;
  color: #1E1E1E;
  margin: 0;
  max-width: 206px;
} */

/* Model list link */
.page-template-template-product-comparision .model-list-link {
  position: relative;
  left: 10px;
  bottom: 10px;
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 15px;
  color: #707070;
  text-decoration: underline;
  margin: 0;
}

/* Features grid */
.page-template-template-product-comparision .features-grid {
  position: absolute;
  left: 10px;
  top: 492px;
  width: 240px;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.page-template-template-product-comparision .feature-status {
  width: 240px;
  height: 33px;
  background: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  position: relative;
  border-bottom: 1px solid #999999;
}
.page-template-template-product-comparision .feature-status:first-child {
  border-top: 1px solid #999999;
}
.page-template-template-product-comparision .feature-status.included {
  background: #FFFFFF;
}

.page-template-template-product-comparision .feature-status.optional {
  background: #FFFFFF;
}

.page-template-template-product-comparision .feature-status.not-available {
  background: #FFFFFF;
}

.page-template-template-product-comparision .product-card .status-text {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 17px;
  margin: 0;
}

.page-template-template-product-comparision .product-card .status-text.included {
  color: #0EA035;
}

.page-template-template-product-comparision .product-card .status-text.optional {
  color: #A0720E;
}

.page-template-template-product-comparision .product-card .status-text.not-available {
  color: #A00E0E;
}

/* Status icons */
.page-template-template-product-comparision .product-card .status-icon {
  width: 19px;
  height: 19px;
  flex-shrink: 0;
}

/* No icon for included status - Figma design shows text only */

.page-template-template-product-comparision .product-card .status-icon.not-available {
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15" fill="none"><path d="M7.5 11.0324C7.63828 11.0324 7.75413 10.9857 7.84754 10.8923C7.94043 10.7989 7.98688 10.683 7.98688 10.5448C7.98688 10.407 7.94017 10.2914 7.84675 10.198C7.75333 10.1046 7.63775 10.0576 7.5 10.0571C7.36225 10.0566 7.24667 10.1033 7.15325 10.1972C7.05983 10.2912 7.01313 10.4067 7.01313 10.544C7.01313 10.6812 7.05983 10.797 7.15325 10.8915C7.24667 10.986 7.36225 11.0335 7.5 11.0324ZM7.5 8.41279C7.61294 8.41279 7.70715 8.37479 7.78263 8.29879C7.8581 8.22279 7.89583 8.12885 7.89583 8.01696V4.05862C7.89583 3.94621 7.85783 3.85226 7.78183 3.77679C7.70583 3.70132 7.61162 3.66332 7.49921 3.66279C7.38679 3.66226 7.29285 3.70026 7.21737 3.77679C7.1419 3.85332 7.10417 3.94726 7.10417 4.05862V8.01696C7.10417 8.12885 7.14217 8.22279 7.21817 8.29879C7.29417 8.37479 7.38838 8.41279 7.50079 8.41279M7.50238 14.625C6.51701 14.625 5.59076 14.4382 4.72363 14.0645C3.85649 13.6903 3.10203 13.1826 2.46025 12.5413C1.81847 11.9001 1.31049 11.1464 0.936292 10.2803C0.562097 9.41425 0.375 8.48826 0.375 7.50238C0.375 6.51649 0.562097 5.59024 0.936292 4.72363C1.30996 3.85649 1.81689 3.10203 2.45708 2.46025C3.09728 1.81847 3.85121 1.31049 4.71888 0.936292C5.58654 0.562097 6.51279 0.375 7.49762 0.375C8.48246 0.375 9.40871 0.562097 10.2764 0.936292C11.1435 1.30996 11.898 1.81715 12.5398 2.45788C13.1815 3.0986 13.6895 3.85253 14.0637 4.71967C14.4379 5.58681 14.625 6.51279 14.625 7.49762C14.625 8.48246 14.4382 9.40871 14.0645 10.2764C13.6908 11.144 13.1831 11.8985 12.5413 12.5398C11.8996 13.181 11.1459 13.689 10.2803 14.0637C9.41478 14.4384 8.48879 14.6255 7.50238 14.625ZM7.5 13.8333C9.26806 13.8333 10.7656 13.2198 11.9927 11.9927C13.2198 10.7656 13.8333 9.26806 13.8333 7.5C13.8333 5.73194 13.2198 4.23438 11.9927 3.00729C10.7656 1.78021 9.26806 1.16667 7.5 1.16667C5.73194 1.16667 4.23438 1.78021 3.00729 3.00729C1.78021 4.23438 1.16667 5.73194 1.16667 7.5C1.16667 9.26806 1.78021 10.7656 3.00729 11.9927C4.23438 13.2198 5.73194 13.8333 7.5 13.8333Z" fill="%23A00E0E"/%3E%3C%2Fsvg%3E') no-repeat center;
}
.page-template-template-product-comparision .product-card .status-icon.included {
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="13" height="16" viewBox="0 0 13 16" fill="none"><path d="M6.49992 15.2346L1.46967 11.4615C1.31239 11.3464 1.18784 11.1971 1.096 11.0134C1.00417 10.8298 0.958252 10.6384 0.958252 10.4395V1.65433C0.958252 1.28964 1.08043 0.985375 1.32479 0.741542C1.56915 0.497708 1.87342 0.375528 2.23759 0.375H10.763C11.1272 0.375 11.4315 0.497181 11.6758 0.741542C11.9202 0.985903 12.0421 1.29017 12.0416 1.65433V10.4387C12.0416 10.6387 11.9957 10.8305 11.9038 11.0142C11.812 11.1979 11.6874 11.347 11.5302 11.4615L6.49992 15.2346ZM6.49992 14.2292L11.052 10.8187C11.1132 10.768 11.1615 10.7099 11.1969 10.6445C11.2322 10.5791 11.2499 10.5052 11.2499 10.4228V1.65433C11.2499 1.53242 11.1993 1.42053 11.0979 1.31867C10.9966 1.21681 10.8847 1.16614 10.7623 1.16667H2.23759C2.11567 1.16667 2.00378 1.21733 1.90192 1.31867C1.80006 1.42 1.74939 1.53162 1.74992 1.65354V10.4228C1.74992 10.5041 1.7676 10.578 1.80296 10.6445C1.83832 10.711 1.88661 10.7691 1.94784 10.8187L6.49992 14.2292ZM5.66867 9.32717L9.59375 5.40208L9.03325 4.83208L5.66867 8.19667L3.97609 6.50408L3.40609 7.06458L5.66867 9.32717ZM6.49992 1.16667H1.74992H11.2499H6.49992Z" fill="%230EA035"/></svg>') no-repeat center;
}
.page-template-template-product-comparision .product-card .status-icon.optional {
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 15 15" fill="none"><path d="M7.50238 14.625C6.51701 14.625 5.59076 14.4382 4.72363 14.0645C3.85649 13.6903 3.10203 13.1826 2.46025 12.5413C1.81847 11.9001 1.31049 11.1464 0.936292 10.2803C0.562097 9.41425 0.375 8.48826 0.375 7.50238C0.375 6.51649 0.562097 5.59024 0.936292 4.72363C1.30996 3.85649 1.81689 3.10203 2.45708 2.46025C3.09728 1.81847 3.85121 1.31049 4.71888 0.936292C5.58654 0.562097 6.51279 0.375 7.49762 0.375C8.48246 0.375 9.40871 0.562097 10.2764 0.936292C11.1435 1.30996 11.898 1.81715 12.5398 2.45788C13.1815 3.0986 13.6895 3.85253 14.0637 4.71967C14.4379 5.58681 14.625 6.51279 14.625 7.49762C14.625 8.48246 14.4382 9.40871 14.0645 10.2764C13.6908 11.144 13.1831 11.8985 12.5413 12.5398C11.8996 13.181 11.1459 13.689 10.2803 14.0637C9.41478 14.4384 8.48879 14.6255 7.50238 14.625ZM7.5 13.8333C9.26806 13.8333 10.7656 13.2198 11.9927 11.9927C13.2198 10.7656 13.8333 9.26806 13.8333 7.5C13.8333 5.73194 13.2198 4.23438 11.9927 3.00729C10.7656 1.78021 9.26806 1.16667 7.5 1.16667C5.73194 1.16667 4.23438 1.78021 3.00729 3.00729C1.78021 4.23438 1.16667 5.73194 1.16667 7.5C1.16667 9.26806 1.78021 10.7656 3.00729 11.9927C4.23438 13.2198 5.73194 13.8333 7.5 13.8333Z" fill="%23A0720E"/><path d="M5.5 7.5L7 9L10 6" stroke="%23A0720E" stroke-width="1.2" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat center;
}
/* Feature tooltip icons in sidebar */
.page-template-template-product-comparision .features-column .feature-tooltip-icon {
  position: absolute;
  right: -22px;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  cursor: pointer;
  z-index: 10;
}

.page-template-template-product-comparision .feature-tooltip-icon svg {
  width: 100%;
  height: 100%;
}

/* .page-template-template-product-comparision .feature-tooltip-icon:hover svg circle {
  stroke: #A0A0A0;
} */

.page-template-template-product-comparision .feature-tooltip-icon:hover svg path {
  fill: #9C9C9C;
}

/* Enhanced tooltip */
.page-template-template-product-comparision .enhanced-tooltip {
  position: absolute;
  background: #FFFFFF;
  color: #757575;
  padding: 16px;
  border-radius: 8px;
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  line-height: 1.4;
  max-width: 280px;
  word-wrap: break-word;
  z-index: 1000;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
  border: 1px solid #E5E5E5;
  opacity: 0;
  animation: fadeInTooltip 0.2s ease-out forwards;
}

.page-template-template-product-comparision .enhanced-tooltip::before {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 8px solid transparent;
  border-top-color: #FFFFFF;
}

.page-template-template-product-comparision .enhanced-tooltip::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 9px solid transparent;
  border-top-color: #E5E5E5;
  z-index: -1;
}

/* Tooltip when positioned below the element */
.page-template-template-product-comparision .enhanced-tooltip.tooltip-below::before {
  top: -8px;
  border: 8px solid transparent;
  border-bottom-color: #FFFFFF;
  border-top: none;
}

.page-template-template-product-comparision .enhanced-tooltip.tooltip-below::after {
  top: -9px;
  border: 9px solid transparent;
  border-bottom-color: #E5E5E5;
  border-top: none;
}

@keyframes fadeInTooltip {
  from {
    opacity: 0;
    transform: translateY(-5px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* View Product button */
.page-template-template-product-comparision .view-product-btn {
  position: absolute;
  left: 10px;
  bottom: 45px;
  width: 240px;
  height: 33px;
  background: #F56721;
  border: 1px solid #EE5A0A;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.2s ease;
}

.page-template-template-product-comparision .view-product-text {
  font-family: Matritsa, sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 17px;
  text-transform: capitalize;
  color: #FFFFFF;
  margin: 0;
}

.page-template-template-product-comparision .view-product-btn:hover {
  background: #E55A0A;
}

/* Hide card button - center aligned */
.page-template-template-product-comparision .hide-card-section {
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  cursor: pointer;
  flex-direction: row-reverse;
}

.page-template-template-product-comparision .hide-card-text {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 17px;
  text-transform: uppercase;
  color: #CACACA;
  margin: 0;
}

.page-template-template-product-comparision .hide-card-icon {
  width: 24px;
  height: 24px;
  background: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10.4 6.73171H13.6C13.6 6.31771 13.4314 5.92067 13.1314 5.62793C12.8313 5.33519 12.4243 5.17073 12 5.17073C11.5757 5.17073 11.1687 5.33519 10.8686 5.62793C10.5686 5.92067 10.4 6.31771 10.4 6.73171ZM9.2 6.73171C9.2 6.37297 9.27242 6.01775 9.41314 5.68633C9.55385 5.3549 9.7601 5.05376 10.0201 4.8001C10.2801 4.54644 10.5888 4.34522 10.9285 4.20794C11.2682 4.07066 11.6323 4 12 4C12.3677 4 12.7318 4.07066 13.0715 4.20794C13.4112 4.34522 13.7199 4.54644 13.9799 4.8001C14.2399 5.05376 14.4461 5.3549 14.5869 5.68633C14.7276 6.01775 14.8 6.37297 14.8 6.73171H19.4C19.5591 6.73171 19.7117 6.79338 19.8243 6.90316C19.9368 7.01293 20 7.16182 20 7.31707C20 7.47232 19.9368 7.62121 19.8243 7.73099C19.7117 7.84077 19.5591 7.90244 19.4 7.90244H18.344L17.408 17.3549C17.3362 18.0792 16.9904 18.7514 16.4381 19.2404C15.8859 19.7295 15.1666 20.0003 14.4208 20H9.5792C8.83349 20.0001 8.11448 19.7292 7.56236 19.2402C7.01024 18.7512 6.66459 18.0791 6.5928 17.3549L5.656 7.90244H4.6C4.44087 7.90244 4.28826 7.84077 4.17574 7.73099C4.06321 7.62121 4 7.47232 4 7.31707C4 7.16182 4.06321 7.01293 4.17574 6.90316C4.28826 6.79338 4.44087 6.73171 4.6 6.73171H9.2ZM10.8 10.439C10.8 10.2838 10.7368 10.1349 10.6243 10.0251C10.5117 9.91533 10.3591 9.85366 10.2 9.85366C10.0409 9.85366 9.88826 9.91533 9.77574 10.0251C9.66321 10.1349 9.6 10.2838 9.6 10.439V16.2927C9.6 16.4479 9.66321 16.5968 9.77574 16.7066C9.88826 16.8164 10.0409 16.878 10.2 16.878C10.3591 16.878 10.5117 16.8164 10.6243 16.7066C10.7368 16.5968 10.8 16.4479 10.8 16.2927V10.439ZM13.8 9.85366C13.9591 9.85366 14.1117 9.91533 14.2243 10.0251C14.3368 10.1349 14.4 10.2838 14.4 10.439V16.2927C14.4 16.4479 14.3368 16.5968 14.2243 16.7066C14.1117 16.8164 13.9591 16.878 13.8 16.878C13.6409 16.878 13.4883 16.8164 13.3757 16.7066C13.2632 16.5968 13.2 16.4479 13.2 16.2927V10.439C13.2 10.2838 13.2632 10.1349 13.3757 10.0251C13.4883 9.91533 13.6409 9.85366 13.8 9.85366ZM7.7872 17.2425C7.83035 17.677 8.0378 18.0802 8.36909 18.3735C8.70039 18.6669 9.1318 18.8294 9.5792 18.8293H14.4208C14.8682 18.8294 15.2996 18.6669 15.6309 18.3735C15.9622 18.0802 16.1697 17.677 16.2128 17.2425L17.1392 7.90244H6.8608L7.7872 17.2425Z" fill="%23CACACA"/></svg>') no-repeat center;
  flex-shrink: 0;
}

/* Navigation arrows */
.page-template-template-product-comparision .nav-arrow-left {
  position: absolute;
  left: 210px;
  top: 400px;
  width: 46px;
  height: 46px;
  background: transparent;
  /* border: 5.55px solid #EEEEEE; */
  /* border-radius: 50%; */
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5;
}

.page-template-template-product-comparision .nav-arrow-left::before {
  content: '';
  width: 50px;
  height: 50px;
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="%234A4A4A" stroke-width="3"><path stroke-linecap="round" stroke-linejoin="round" d="M15 19l-7-7 7-7"/></svg>') no-repeat center;
  background-size: contain;
}

.page-template-template-product-comparision .nav-arrow-right {
  position: absolute;
  right: 0px;
  top: 400px;
  width: 46px;
  height: 46px;
  background: transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 5;
}

.page-template-template-product-comparision .nav-arrow-right::before {
  content: '';
  width: 50px;
  height: 50px;
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="%234A4A4A" stroke-width="3"><path stroke-linecap="round" stroke-linejoin="round" d="M15 19l-7-7 7-7"/></svg>') no-repeat center;
  background-size: contain;
  transform: rotate(180deg);
}

/* Old static tooltip styles removed - now using dynamic tooltips */

/* Close buttons on sticky cards */
.page-template-template-product-comparision .sticky-close {
  position: absolute;
  right: 13px;
  top: 13px;
  width: 21px;
  height: 21px;
  cursor: pointer;
  z-index: 15;
}

.page-template-template-product-comparision .sticky-close::before {
  content: '';
  width: 12.25px;
  height: 12.25px;
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="%23DCDCDC" viewBox="0 0 24 24"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/></svg>') no-repeat center;
  position: absolute;
  top: 4.38px;
  left: 4.38px;
}

/* Sticky section at bottom - only for this page */
.page-template-template-product-comparision .sticky-products-section {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: 249px;
  background: #FFFFFF;
  border-top: 1px solid #E0E0E0;
  z-index: 10; /* Lower z-index to not interfere with header/footer */
  display: none; /* Hidden by default */
  justify-content: center;
  align-items: flex-start;
  padding-top: 20px;
  gap: 14px;
  box-sizing: border-box;
}

/* .page-template-template-product-comparision .sticky-products-section.show {
  display: flex !important;
} */

.page-template-template-product-comparision .sticky-card {
  width: 222px;
  height: 249px;
  background: #F9F9F9;
  border-radius: 6px;
  position: relative;
}

/* Product image variations */
/* .page-template-template-product-comparision .product-card:nth-child(1) .product-image-large {
  background: #D9D9D9 url('product-1-image') no-repeat center/cover;
} */

.page-template-template-product-comparision .product-card:nth-child(2) .product-image-large {
  background: linear-gradient(135deg, #D9D9D9 0%, #4A90E2 100%);
}

.page-template-template-product-comparision .product-card:nth-child(3) .product-image-large {
  background: linear-gradient(135deg, #D9D9D9 0%, #9B59B6 100%);
}

.page-template-template-product-comparision .product-card:nth-child(4) .product-image-large {
  background: #D9D9D9 url('product-4-image') no-repeat center/cover;
}

/* Remove all existing grid layouts */
.page-template-template-product-comparision .comparison-grid {
  display: block !important;
  grid-template-columns: none !important;
  gap: 0 !important;
}

/* Hide feature header that was in grid */
.page-template-template-product-comparision .feature-header {
  display: none !important;
}

/* Responsive adjustments */
@media (max-width: 1340px) {
  .page-template-template-product-comparision .comparison-grid {
    transform: scale(0.9);
    transform-origin: top left;
  }
  .page-template-template-product-comparision .bottom-reset-section{
        transform: scale(0.9);
        transform-origin: top left;
        z-index: 999;
        bottom: 130px;
        right: 5px;
  }
}

@media (max-width: 768px) {
  .page-template-template-product-comparision .comparison-grid {
    transform: scale(0.5);
    transform-origin: top left;
  }
  
  /* Show only one product card on mobile */
  .page-template-template-product-comparision .product-card:nth-child(n+2) {
    display: none;
  }

  .page-template-template-product-comparision .reset-filter-bottom{
    width: 150px;
  }
  .page-template-template-product-comparision .features-column{
    display: none;
  }
}

/* Modal styles */
.page-template-template-product-comparision #compatibility-modal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 100;
  display: none;
  align-items: center;
  justify-content: center;
}

.page-template-template-product-comparision #compatibility-modal.show {
  display: flex;
}

.page-template-template-product-comparision .modal-content {
  background: #FFFFFF;
  max-width: 650px;
  width: 90%;
  max-height: 58vh;
  overflow-y: auto;
  padding: 0 20px !important;
  position: fixed;
  border-radius: 0;
  top: 20%;
}

.page-template-template-product-comparision .close-modal {
  position: absolute;
  top: 10px;
  right: 15px;
  font-size: 24px;
  cursor: pointer;
  color: #666;
  background: none;
  border: none;
}

.page-template-template-product-comparision .close-modal:hover {
  color: #000;
}

.page-template-template-product-comparision .close-product-compare{
    float: right;
    color: #DCDCDC;
    position: relative;
    bottom: 0px;
    font-size: 30px;
    font-weight: 600;
    right: 15px;
    cursor: pointer;
    position: absolute;
    top: 0px;
    right: 15px;
    height: fit-content;
}

#compatibility-table {
    table-layout: fixed;
}
.modal-error{
  position: relative;
  top: 0px;
  padding: 30px;
  right: 20px;
}
.nav-arrow-right.last::before{
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="%23F0F0F0" stroke-width="3"><path stroke-linecap="round" stroke-linejoin="round" d="M15 19l-7-7 7-7"/></svg>');
}
.nav-arrow-left.last::before{
  background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="%23F0F0F0" stroke-width="3"><path stroke-linecap="round" stroke-linejoin="round" d="M15 19l-7-7 7-7"/></svg>');
}
.owl-item.hide{
  display: none !important;
}
.header-sticky-wrapper {
  position: sticky;
  top: 80px;
  z-index: 10;
  background: #F9F9F9;
  border-radius: 6px;
}
.description-section-wrapper{
   background: #F9F9F9;
}
.owl-carousel .owl-stage-outer {
  position: relative;
  overflow: unset;
  clip-path: inset(0 0 0 0 round 0);
}
.woocommerce-breadcrumb{
  display: none;
}
.banner-wrapper {
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  position: relative;
}

.banner-wrapper img {
  width: 100%;
  height: auto;
  display: block;
}
.heading-title{
  text-align: center;
  margin-bottom: 30px;
  font-family: Matritsa;
  margin-left: 10%;
}

/* Conversion Blogs Part */
.conversion-blogs {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 40px 0;
}
.conversion-blog-wrapper{
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  background: #EDEDED;
}
.conversion-blog {
  display: flex;
  flex-direction: row; /* <-- Force row layout */
  flex-wrap: wrap;
  gap: 24px;
  align-items: center;
  padding: 20px 40px;
  position: relative;
  max-width: 1440px;
  width: 100%;
  margin: auto;
}

.conversion-blog-wrapper:nth-child(even) .conversion-blog{
  flex-direction: row-reverse;
  justify-content: start;
}

.conversion-blog__image,
.conversion-blog__content {
  flex: 1 1 45%;
}

.conversion-blog__image img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 6px;
}

.conversion-blog__title {
  font-family: 'Matritsa', sans-serif;
  font-weight: 900;
  font-size: 32px;
  line-height: 1;
  text-transform: uppercase;
  margin-bottom: 16px;
  color: #000000;
}

.conversion-blog__description {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.4;
  margin-bottom: 16px;
}
.conversion-blog__button {
  font-family: 'Matritsa', sans-serif;
  font-weight: 900;
  font-size: 16px;
  line-height: 1;
  color: #EF6526;
  text-decoration: none;
  text-transform: uppercase;
  display: inline-block;
  border: 2px solid #EF6526;
  padding: 10px 30px;
  line-height: 22px;
  text-transform: capitalize;
}

/* 📱 Mobile: Stack columns */
@media screen and (max-width: 768px) {
  .conversion-blog {
    flex-direction: column;
  }
  .conversion-blog-wrapper:nth-child(even) .conversion-blog {
    flex-direction: column;
  }

  .conversion-blog__image,
  .conversion-blog__content {
    max-width: 100%;
  }
}

.conversion-blogs .video-thumbnail {
  position: relative;
  display: inline-block;
  width: 100%;
  max-width: 100%;
}

.conversion-blogs .video-thumbnail img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 2px;
}

.conversion-blogs .video-play-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none; /* so click passes through to parent if needed */
}


/* user submitted seciton in comparison page */

.user-submitted {
  background-color: #181818;
  padding: 40px 20px;
  text-align: center;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
}

.user-submitted__title {
  font-family: 'Matritsa', sans-serif;
  font-weight: 600;
  font-style: Black;
  font-size: 32px;
  color: #ffffff;
  margin-bottom: 30px;
}

.user-submitted__gallery {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 5px;
  margin-bottom: 30px;
}

.user-submitted__image img {
  max-width: 100%;
  height: auto;
  border-radius: 0px;
}

.user-submitted__button {
  display: inline-block;
  font-family: 'Matritsa', sans-serif;
  font-weight: 600;
  font-style: Black;
  font-size: 16px;
  color: #EF6526;
  border: 2px solid #EF6526;
  padding: 10px 50px;
  text-decoration: none;
  margin-bottom: 20px;
  transition: all 0.3s ease;
}

.user-submitted__button:hover {
  background-color: #EF6526;
  color: #ffffff;
}

.user-submitted__description {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 14px;
  color: #ffffff;
  max-width: 495px;
  margin: 0 auto;
  line-height: 1.6;
}
.banner-image h1{
  font-family: Matritsa;
    font-weight: 600;
    font-size: 4vw;
    letter-spacing: 3px;
    text-transform: uppercase;
    position: relative;
    color: #ffffff;
    text-align: center;
    bottom: 22vw;
}
@media screen and (min-width: 768px) {
  .conversion-blog__content>p{
    max-width: 412px;
  }
  .conversion-blog-wrapper:nth-child(even) .conversion-blog__content>p {
    max-width: 460px;
  }
}


#weapons_compatibility_heading {
    text-align: center;
    color: #F56721;
    font-weight: 700;
    font-size: 24px;
    line-height: 31.2px;
    padding: 1em;
    font-family: 'Inter',sans-serif;
}

.modal-close-compatibility {
    color: #000;
    font-family: 'Inter',sans-serif;
}

.seemore-product {
    text-align: center
}
.modal-overlay-product-compatibility {
    opacity: 1;
    background-color: #1414148C;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999
}

#compatibility-table {
    border-spacing: 5px;
    font-family: 'Inter',sans-serif;
}

#compatibility-table tr {
    background-color: #F4F4F4;
    font-weight: 400
}

#compatibility-table td {
    border: 1px solid #fff;
    font-family: 'Inter',sans-serif;
    font-weight: 400;
    font-size: 18px
}

.modal-close-compatibility {
    font-weight: 400;
    color: #000;
    width: 3%;
    position: absolute;
    left: 95%;
    top: 5%;
    font-size: 16px;
    cursor: pointer
}
html.overflow-hidden{
  overflow: hidden;
}
@media (min-width:769px) and (max-width:1474px) {
  .page-template-template-product-comparision .comparison-grid {
    margin-left: 2rem;
  }
}