/** Shopify CDN: Minification failed

Line 222:0 Unexpected "<"
Line 293:0 Unexpected "<"

**/


/* CSS from section stylesheet tags */
/* General Form Wrapper */
#form-wrapper {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

#kForm {
    width: 90%;
    max-width: 500px;
}

#kForm #form-title {
    margin-top: 0;
    font-weight: 400;
    text-align: center;
}


/* Slider Container */
#debt-amount-slider {
    display: flex;
    justify-content: space-around;
    position: relative;
    width: 100%;
    height: 60px;
    margin-bottom: 30px !important;
    user-select: none;
    margin: 0 auto;
}

#debt-amount-slider::before {
  content: "";
  position: absolute;
  height: 2px;
  background: #000;
  top: 50%;
  left: var(--line-left, calc(12.5% + 15px)); /* Fallback value */
  width: var(--line-width, calc(100% - 25% - 30px)); /* Fallback value */
  transform: translateY(-50%);
  z-index: 0;
}

  
#debt-amount-slider input,
#debt-amount-slider label {
    box-sizing: border-box;
    flex: 1;
    cursor: pointer;
}

#debt-amount-slider label {
    position: relative;
    text-align: center;
    font-weight: 400;
    color: #555;
}

/* Slider Points */
#debt-amount-slider label::before {
    content: attr(data-debt-amount);
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translateX(-50%);
    font-size: 14px;
    opacity: 0.85;
    transition: all 0.15s ease-in-out;
}

#debt-amount-slider label::after {
    content: " ";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 30px;
    height: 30px;
    border: 2px solid #000;
    background: #fff;
    border-radius: 50%;
    z-index: 1;
    transition: all 0.2s ease-in-out;
}

#debt-amount-slider input {
    display: none;
}

#debt-amount-slider input:checked + label::before {
    font-weight: 700;
    color: #e63946;
    opacity: 1;
}

#debt-amount-slider input:checked + label::after {
    border-color: #e63946;
    transform: translate(-50%, -50%) scale(1.2);
}

/* Slider Active Position */
#debt-amount-slider #debt-amount-pos {
    display: block;
    position: absolute;
    top: 50%; /* Align vertically */
    left: 50%; /* Align horizontally */
    transform: translate(-50%, -50%); /* Center it */
    width: 15px; /* Smaller size */
    height: 15px;
    background: #e63946; /* Red indicator */
    border-radius: 50%;
    border: 1px solid #fff; /* Inner border color */
    z-index: 2; /* Ensure it's above other elements */
    transition: transform 0.2s ease-in-out;
    opacity: 1;
}

/* Adjust positions for radio inputs */
#debt-amount-slider input:checked:nth-child(1) ~ #debt-amount-pos { left: 12.5%; }
#debt-amount-slider input:checked:nth-child(3) ~ #debt-amount-pos { left: 37.5%; }
#debt-amount-slider input:checked:nth-child(5) ~ #debt-amount-pos { left: 62.5%; }
#debt-amount-slider input:checked:nth-child(7) ~ #debt-amount-pos { left: 87.5%; }

/* Responsive Adjustments */
@media (max-width: 768px) {
  #debt-amount-slider::before {
  content: "";
  position: absolute;
  height: 2px;
  background: #000;
  top: 50%;
  left: var(--line-left, 12.5%); /* Fallback if JS doesn't update */
  width: var(--line-width, 75%); /* Fallback if JS doesn't update */
  transform: translateY(-50%);
  z-index: 0;

}
  
    #debt-amount-slider {
        display: flex;
        flex-direction: row; /* Keep horizontal alignment */
        justify-content: space-between; /* Evenly space out items */
        align-items: center;
        position: relative;
        height: 50px;
        margin: 0 auto;
    }


    #debt-amount-slider label {
        position: relative;
        width: 30px; /* Fixed width for the circle */
        height: 30px; /* Fixed height for the circle */
        display: flex;
        align-items: center;
        justify-content: center;
    }

    #debt-amount-slider label::after {
        content: "";
        position: absolute;
        width: 20px; /* Default circle size */
        height: 20px;
        border: 2px solid #000; /* Default border */
        border-radius: 50%;
        background: #fff;
        transform: translate(-50%, -50%);
        left: 50%;
        top: 50%;
        transition: all 0.2s ease-in-out; /* Smooth animation */
    }

    #debt-amount-slider input {
        display: none; /* Hide radio buttons */
    }

    #debt-amount-slider input:checked + label::after {
        border-color: #e63946; /* Highlight border color */
        width: 26px; /* Bigger size on click */
        height: 26px;
        background: #ffffff; /* Red background */
    }

  

    #debt-amount-slider label::before {
        content: attr(data-debt-amount);
        position: absolute;
        bottom: -25px; /* Place text below the circle */
        left: 50%;
        transform: translateX(-50%);
        font-size: 12px;
        color: #555;
    }

    /* Red position indicator (optional) */
    #debt-amount-slider #debt-amount-pos {
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 15px;
        height: 15px;
        background: #e63946;
        border-radius: 50%;
        z-index: 3;
        transition: left 0.2s ease-in-out;
    }
}
.product-compare__title {
    min-height: 2.6em;
  }
<style>
  /* Ensure the list has no default padding or margin */
.icon-link-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* Style for each list item */
.icon-link-item {
  margin-bottom: 10px; /* Adjust spacing between items as needed */
}

/* Flex container for icon and link */
.icon-link {
  display: flex;
  align-items: center;
  text-decoration: none; /* Remove underline from links */
  color: #333; /* Set desired link color */
  transition: color 0.3s ease;
}

/* Change link color on hover */
.icon-link:hover {
  color: #007BFF; /* Example hover color */
}

/* Style for the SVG icon */
.icon {
  width: 20px; /* Adjust size as needed */
  height: 20px;
  fill: currentColor; /* Inherit the text color */
  margin-right: 8px; /* Space between icon and text */
  flex-shrink: 0; /* Prevent icon from shrinking */
}

/* Optional: Style for the link text */
.link-text {
  font-size: 16px; /* Adjust font size as needed */
  line-height: 1.5;
}

.omid-custom-link-container {
  display: flex;
  justify-content: center !important; /* Center the content horizontally */
  border-right: 1px solid; 
  border-color: #fff;
}
.omid-custom-link {
  display: flex!important;
  align-items: center; /* Align icon and text vertically */
  text-decoration: none; /* Remove underline from the link */
  color: inherit; /* Use the default text color */
  gap: 8px; /* Add space between the icon and the text */
  color: #fff;
}
.omid-custom-link:hover {
  color: #fff; 
}

.omid-custom-link-icon-left {
  display: flex;
  align-items: center; /* Center the SVG vertically */
  justify-content: center; /* Center the SVG horizontally */
  width: 10px; /* Set a consistent size for the icon */
  height: 24px;
}

.omid-custom-link-text {
  font-size: 15px;
}
</style>