.commonpack-test {
    width: 100%;
    margin: 0 auto;
    padding: 80px 5% 20px;
}

/* Heading & paragraph */
.packpoplab-heading {
    font-size: 2.25rem;
    font-weight: 700;
    color: #0a2540;
    text-align: center;
    margin-bottom: 10px;
}

.packpoplab-parah {
    font-size: 1.125rem;
    color: #64748b;
    margin-bottom: 50px;
    text-align: center;
}

/* Carousel container */
.carousel-container {
    position: relative;
    overflow: visible;  /* allow arrows to overflow */
    padding: 0 50px;    /* spacing for arrows */
}

/* Horizontal scroll list */
.carousel-wrapper {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 20px;
    scroll-behavior: smooth;
    padding: 10px 0;
}
.carousel-wrapper::-webkit-scrollbar { display: none; }

/* Card item wrapper */
.item {
    min-width: 400px;
    display: flex;
    justify-content: center;
}

/* Card */
.dg-card {
    position: relative;
    overflow: visible;
    background: #fff;
    border-radius: 20px;
    border: 1px solid #cbcbcb;
    padding: 40px 25px;
    width: 100%;
    max-width: 400px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    transition: all 0.3s ease;
}

/* Most Popular Badge */
.dg-mostpopular-badge {
    position: absolute;
    top: 0;
    right: 0;
    background: #ff8a00;
    color: #fff;
    padding: 8px 20px;
    font-size: 13px;
    font-weight: 600;
    z-index: 10;
    display: block;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

/* Card hover */
.dg-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
    border-color: #ff8a00;
}

/* Header */
.dg-card-header {
    margin-bottom: 10px;
}
.dg-title {
    font-size: 1.2rem;
    font-weight: 700;
    color: #000000;
    line-height: 1.3;
}
.dg-subtitle {
    color: #64748b;
    font-size: 1.01rem;
    margin-top: 3px;
}

/* Pricing */
.dg-card-price {
    margin: 15px 0;
}
.dg-price {
    font-size: 26px;
    font-weight: 700;
    color: #000;
}
.dg-old-price {
    font-size: 15px;
    color: #888;
    text-decoration: line-through;
    margin-left: 6px;
}
.dg-discount {
    background: #ffe5cc;
    color: #ff6f00;
    padding: 9px 26px;
    border-radius: 28px;
    margin-top: 8px;
    font-size: 13px;
    font-weight: 600;
    display: inline-block;
}

/* Body */
.dg-card-body {
    flex-grow: 1;
    margin-bottom: 15px;
}
.dg-include-title {
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 10px;
}
.dg-include-list {
    margin-left: 35px;
}
.dg-include-list li {
    color: #444;
    margin-bottom: 6px;
    font-size: 14px;
}

/* Footer */
.dg-card-footer {
    margin-top: auto;
}
.dg-btn {
    width: 100%;
    background: #00a3c8;
    padding: 12px;
    border-radius: 30px;
    border: none;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: .2s;
}
.dg-btn:hover {
    background: #028fb0;
}

/* Carousel arrows */
.carousel-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: #fff;
    border: 2px solid #ddd;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    cursor: pointer;
    font-size: 22px;
    line-height: 36px;
    text-align: center;
    font-weight: 600;
    z-index: 10;
}
.carousel-arrow.prev { left: 10px; }
.carousel-arrow.next { right: 10px; }




  #search-results {
    transition: opacity 0.25s ease-in-out;
  }
  #search-results.updating {
    opacity: 0.4;
  }
  .lab-hero {
    transition: opacity 0.4s ease, height 0.3s ease;
  }
  .lab-hero[style*="display: none"] {
    opacity: 0;
    height: 0;
    overflow: hidden;
  }
    /* 🟩 Style for the “no results” box */
    .no-results-box {
      background: #fff;
      border: 1px solid #e0e0e0;
      border-radius: 12px;
      padding: 25px;
      margin: 20px auto;
    width: 80%;
      text-align: center;
      box-shadow: 0 2px 6px rgba(0,0,0,0.08);
      color: #444;
      font-size: 15px;
      line-height: 1.6;
    }

  .no-results-box svg {
    display: block;
    margin: 0 auto 10px; /* ✅ centers the SVG with spacing below */
    width: 40px;
    height: 40px;
    stroke: #667085;
  }
    .no-results-box strong {
      font-weight: 600;
      color: #222;
    }

    .no-results-box .hint-keyword {
      color: #667085;
      font-weight: 500;
    }
      #search-results {
      transition: opacity 0.25s ease-in-out;
    }
    #search-results.updating {
      opacity: 0.4;
    }
  /* HERO SECTION */

  .lab-hero {
  background: linear-gradient(
    to left top,
    #e8f5f8 0%, 
    #ffffff 50%, 
    #00a7cc33 100%
    );
    padding: 20px 6%;
    .hero-wrapper {
      margin-top: 7%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      flex-wrap: wrap;
    }

    .hero-text {
      flex: 1;
      min-width: 320px;

      .badge {
        display: inline-block;
        background: #ff7a00;
        color: #fff;
        font-weight: 600;
        font-size: 13px;
        border-radius: 20px;
        padding: 12px 13px;
        margin-bottom: 20px;
      }

      h1 {
        font-size: 3rem;
        font-weight: 700;
        color: #0a2540;
        line-height: 1.3;
        margin-bottom: 16px;

        span {
          color: #ff7a00;
        }
      }

      .subtitle {
        color: #4a5568;
        font-size: 18px;
        line-height: 1.5;
        margin-bottom: 28px;
        max-width: 640px;
      }

      .features {
        display: flex;
        flex-direction: column;
        gap: 18px;
        margin-bottom: 58px;

        .feature-item {
          display: flex;
          align-items: flex-start;
          gap: 12px;

          .icon, .iconor {
    display: flex;                /* Flexbox to center the SVG */
    align-items: center;          /* Vertically center */
    justify-content: center;      /* Horizontally center */
    background: #00a7cc4d;          /* or #e7c783ff for iconor */
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;           /* Make it circular */
    flex-shrink: 0;
    margin-top: 2px;
    }

    .iconor {
      background: #f67b1e33;
    }

    .feature-text{
      margin-top: 1%;
    }
            h4 {
            font-size: 16px;
            font-weight: 600;
            color: #0a2540;
            margin: 0;
          }

          p {
            font-size: 14px;
            color: #6b7280;
            margin: 4px 0 0;
          }
        }
      }

      .btn-primary {
        background: #ff7a00;
        color: #fff;
        font-weight: 600;
        padding: 14px 30px;
        border: none;
        border-radius: 30px;
        cursor: pointer;
        font-size: 16px;
        box-shadow: 0 3px 8px rgba(255, 122, 0, 0.3);
        transition: 0.3s;

        &:hover {
          background: #e86d00;
        }
      }
    }

    .hero-image {
      flex: 1;
      text-align: center;
      position: relative;

      img {
        width: 94%;
        max-width: 620px;
        border-radius: 16px;
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.21);
      }

          .stats-card {
              display: flex;
              justify-content: space-around;
              background: #fff;
              padding: 19px 0;
              border-radius: 12px;
              box-shadow: 0 4px 12px rgba(0, 0, 0, 0.28);
              max-width: 85%;
              margin: -60px auto 0;
              position: relative;
              z-index: 2;
          

        .stat {
          text-align: center;

          h3 {
            color: #ff7a00;
            font-weight: 700;
            font-size: 24px;
            margin: 0;
          }

          p {
            color: #4a5568;
            font-size: 14px;
            margin-top: 4px;
          }
        }
      }
    }
    @media (max-width: 992px) {
      
      .hero-wrapper {
        flex-direction: column;
        text-align: center;
        gap: 40px;
      }

      .hero-text {
        h1 {
          font-size: 30px;
        }
    
        .features {
          align-items: center;
        }
      }

      .hero-image img {
        width: 100%;
        max-width: 400px;
      }

      .hero-image .stats-card {
        max-width: 95%;
      }
}

   
      

  }
  /* HOW IT WORK */

  .how-it-works { 
      text-align: center;
      padding: 80px 5%;
      background-color: #fff;
    }

    .how-it-works h2 {
      font-size: 2.25rem;
      font-weight: 700;
      color: #0a2540;
      margin-bottom: 10px;
    }

    .how-it-works .subtitle {
      color: #64748b;
      font-size: 1.125rem;
      margin-bottom: 50px;
    }

    .steps {
      display: flex;
      justify-content: center;
      gap: 40px;
      flex-wrap: wrap;
    }

    .step-card {
      background: #ffffff;
      border-radius: 20px;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
      width: 420px;
      padding: 40px 25px;
      transition: all 0.3s ease;
    }

    .step-card:hover {
      transform: translateY(-8px);
      box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
    }

    .icon-circle {
      width: 70px;
      height: 70px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0 auto 20px;
      font-size: 28px;
    }

    .icon-circle.light-blue {
        background-color: #00a7cc33;
        color: #ffffff;
    }

    .icon-circle.orange {
      background-color:#ffeddc;
      color: #f67b1e;
    }

    .step-card h3 {
      font-size: 1.2rem;
      font-weight: 700;
      color: #0a2540;
      margin-bottom: 10px;
    }

    .step-card p {
      color: #64748b;
      font-size: 1.01rem;
      line-height: 1.5;
    }



    p {
        margin: 2% 0%;
  }

  /* REVIEW */

  .patient-reviews {
      background: linear-gradient(to bottom right, #e8f5f8 0%, #ffffff 100%);
      text-align: center;
      padding: 80px 5%;
    }

    .patient-reviews h2 {
      font-size: 2rem;
      font-weight: 700;
      color: #0a2540;
      margin-bottom: 10px;
    }

    .patient-reviews .subtitle {
      color: #64748b;
      font-size: 1rem;
      margin-bottom: 50px;
    }

    .reviews-container {
      display: flex;
      justify-content: center;
      flex-wrap: wrap;
      gap: 30px;
      margin-bottom: 40px;
    }

    .review-card {
        background: #ffffff;
        border-radius: 15px;
        padding: 12px 25px;
        width: 311px;
        box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
        transition: all 0.3s ease;
        border: 1px solid #e5e9f0;
    }

    .review-card:hover {
      transform: translateY(-6px);
      box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
    }

    /* .quote {
      font-size: 24px;
      color: #87c2d4;
      text-align: left;
      margin-bottom: 10px;
    } */

    .stars {
      color: #f67b1e;
      font-size: 22px;
      margin-bottom: 15px;
      text-align: left;
      letter-spacing: 1px;
    }

    .review-text {
      color: #475569;
      font-size: 0.85rem;
      font-style: italic;
      line-height: 1.6;
      margin-bottom: 15px;
      text-align: left;
    }

    .review-author {
      color: #0a2540;
      font-weight: 700;
      text-align: left;
      margin: 0;
    }

    .rating-summary {
      display: inline-flex;
      align-items: center;
      background: white;
      border-radius: 50px;
      padding: 10px 25px;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
      font-weight: 600;
      gap: 10px;
    }

    .star-icon {
      color: #f67b1e;
      font-size: 25px;
    }

    .rating-score {
      color: #0a2540;
      font-size: 1.1rem;
    }

    .rating-text {
      color: #64748b;
      font-size: 0.99rem;
    }

    .review-card {
      position: relative;
      padding: 32px 21px;
      background: #fff;
      border-radius: 12px;
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
    }
    .review-card .quote {
      width: 32px;
      height: 32px;
      opacity: 0.3;
      background-repeat: no-repeat;
      background-size: contain;
      background-position: center;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%2300b5d8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Cpath d='M16 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z'/%3E%3Cpath d='M5 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z'/%3E%3C/svg%3E");
      transform: scaleX(1); /* 👈 flips horizontally to make it a closing quote */
      margin-bottom: 10px;
  }

  /* FAQ Items */

  .faq-container {
      margin-top: 40px;
      text-align: left;
    }

    .faq-item {
      background: #fff;
      border: 1px solid #e5e5e5;
      border-radius: 12px;
      margin-bottom: 16px;
      overflow: hidden;
      box-shadow: 0 2px 6px rgba(0,0,0,0.04);
    }

    .faq-question::after {
      content: '';
      position: absolute;
      right: 24px;
      top: 50%;
      width: 8px;
      height: 8px;
      border-right: 2px solid #333;
      border-bottom: 2px solid #333;
      transform: translateY(-50%) rotate(45deg); /* Downward arrow (V shape) */
      transition: transform 0.3s ease;
    }

    .faq-question.active::after {
      transform: translateY(-50%) rotate(-135deg); /* Rotates upward */
    }


    .faq-answer {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.3s ease;
      background: #ffffff;
      padding: 0 24px;
    }

    .faq-answer p {
      font-size: 0.95rem;
      color: #555;
      padding: 16px 0;
    }
    .faq-section {
      max-width: 900px;
      margin: 60px auto;
      padding: 0 20px;
      text-align: left;
    }

    .faq-section h1 {
      font-size: 2rem;
      font-weight: 700;
      text-align: center;
      color: #000;
      margin-bottom: 10px;
    }

    .faq-section .subtitle {
      text-align: center;
      font-size: 1rem;
      color: #666;
      margin-bottom: 30px;
    }

    .faq-container {
      margin-top: 20px;
    }

    .faq-item {
      background: #fff;
      border: 1px solid #e5e5e5;
      border-radius: 12px;
      margin-bottom: 16px;
      overflow: hidden;
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
    }

    .faq-question {
      width: 100%;
      background: none;
      border: none;
      outline: none;
      text-align: left;
      font-size: 1.1rem;
      font-weight: 600;
      padding: 30px 24px;
      cursor: pointer;
      position: relative;
      color: #222;
      transition: background 0.3s;
    }

    .faq-item {
      background: #fff;
      border: 1px solid #e5e5e5;
      border-radius: 12px;
      margin-bottom: 16px;
      overflow: hidden;
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
      transition: box-shadow 0.3s ease, background 0.3s ease, transform 0.3s ease;
    }

    .faq-item:hover {
      background: #ffffff;
      box-shadow: 0 6px 12px rgba(0, 0, 0, 0.1); /* smooth deeper shadow */
      transform: translateY(-3px); /* slight upward lift */
    }

    .faq-answer {
      max-height: 0;
      overflow: hidden;
      background: #ffffff;
      padding: 0 24px;
      transition: max-height 0.3s ease, padding 0.3s ease;
    }

    .faq-question.active + .faq-answer {
      padding: 16px 24px;
      margin-bottom: 16px;
    }

    .faq-answer p {
      font-size: 0.95rem;
      color: #555;
      margin: 0;
  }

  /* BLOGS */
  .blogs-section {
          background: #f9fafa;
          padding: 3rem 2rem;
          font-family: "Poppins", sans-serif;
          text-align: center;
        }
        .blogs-container {
          max-width: 1240px;
          margin: 0 auto;
        }
        .blogs-section h2 {
          font-size: 2.2rem;
          font-weight: 700;
          color: #1c1c1c;
          margin-bottom: 0.8rem;
        }
        .blogs-section p {
          color: #555;
          font-size: 1.2rem;
          margin-bottom: 4rem;
          line-height: 1.6;
          max-width: 620px;
          margin-inline: auto;
          text-align: center;
          word-break: keep-all;
        }
        .blogs-grid {
          display: grid;
          grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
          gap: 1.8rem;
        }
        .blog-card {
          background: #fff;
          border-radius: 12px;
          box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
          overflow: hidden;
          display: flex;
          flex-direction: column;
          transition: all 0.4s ease;
          height: 100%;
        }
        .blog-card:hover {
          transform: translateY(-6px);
          box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
        }
        .blog-image {
          position: relative;
          width: 100%;
          height: 300px;
          overflow: hidden;
        }

        .blog-content {
          padding: 1.1rem;
          display: flex;
          flex-direction: column;
          justify-content: space-between;
          height: 100%;
          text-align: left;
        }
        .blog-content h4 {
          font-size: 1rem;
          line-height: 21px;
          font-weight: 600;
          color: #000000ff;
          transition: color 0.3s ease;
          text-align: left; 
              margin-bottom: -14px;
        }

        .blog-content p {
          font-size: 0.85rem;
          color: #555;
          line-height: 1.6;
          text-align: left;
          margin-bottom: 0;
        }
        meta {
          font-size: 0.65rem;
          color: #777;
          display: flex;
          justify-content: space-between;
          align-items: center;
          flex-wrap: nowrap;
          text-align: left;
        }
        
        .blog-footer {
          display: flex;
          justify-content: space-between;
          align-items: center;
          margin-top: -16px;
          text-align: left;
        }

        .read-more {
          color: #ff7a00;
          font-weight: 600;
          text-decoration: none;
          transition: 0.3s;
        }
        .read-more i {
          margin-left: 6px;
        }
        .read-more:hover {
          color: #e56d00;
        }
        .view-all {
          margin-top: 3rem;
        }
        .btn-view {
          background: #ffffffff;
          color: #000000;
              border: 1px solid #d3d3d3;
      font-weight: 600;
      padding: 0.5rem 1.5rem;
          border-radius: 38px;
          text-decoration: none;
          transition: all 0.3s ease;
        }
        .btn-view:hover {
          background: #00a8cc;
          border-color: #00a8cc;
          color: #ffffffff;
          box-shadow: 0 4px 12px rgba(255, 122, 0, 0.3);
        }




        .blog-image {
          background: linear-gradient(to bottom right, #cae7ed, #f5e3d2);
              padding: 0px 0px 0px;
        }
        .blog-image {
          object-fit: cover;
          display: block;
          margin: 0 auto;
          box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
        }



        .meta {
            display: flex;
            align-items: center;
            gap: 20px;
            font-size: 0.85rem;
            color: #666;
            margin-bottom: -14px;
        }

        .meta i {
          margin-right: 6px;
          color: #999;
        }

    .category {
      display: inline-block;
      background: #00a7cc33; /* light blue */
      color: #ffffffff;/* blue text */
      font-size: 0.85rem;
      font-weight: 500;
      padding: 4px 10px;
      border-radius: 26px;
      line-height: 1.4;
      margin-bottom: -14px;
      width: fit-content; /* ensures it fits only text width */
  }

  /* LAST SECTION */
  .control {
      text-align: center;
      padding: 60px 20px;
      background: #fff;
    }

    .control h1 {
      font-size: 2rem;
      font-weight: 700;
      color: #222;
      margin-bottom: 10px;
    }

    .control .subtitle {
      font-size: 1rem;
      color: #666;
      margin-bottom: 25px;
    }

    .book-test {
      display: inline-block;
      background-color: #ff7a00; /* bright orange */
      color: #fff; /* white text */
      padding: 14px 30px;
      border-radius: 36px;
      font-size: 1rem;
      font-weight: 600;
      text-decoration: none;
      transition: background-color 0.3s ease, transform 0.2s ease;
    }

    .book-test:hover {
      color: #fff;
      background-color: #00a8cc; /* slightly darker on hover */
      transform: translateY(-2px);
  }
  .test-carousel {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 20px;
    }
    .owl-stage-outer{
        padding-left: 5px !important;
    }
    /* Equal height and clean look */
    .test-card, .test-cards{
      width: 315px;
          background: #fff;
        border-radius: 16px;
        border: 3px solid #e5e5e5;
     
      padding: 20px;
      text-align: left;
      transition: all 0.3s ease;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      height: 290px; /* Set fixed height */
    }
    .test-cards{
      width: 360px;
       box-shadow: 0 2px 10px rgba(0,0,0,0.08);
    }

    .test-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    }

    /* Icon circle */
    .icons {
      width: 3.5rem;
      height: 3.5rem;
      background: #00a7cc33;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 20px;
      color: #2a6df4;
      margin-bottom: 10px;
    }
    .cards-header {
    display: flex;
    align-items: center; /* vertically center icon with text */
    gap: 10px; /* space between icon and name */
  }

  .reicons {
    width: 3rem;          /* fixed width */
    height: 3rem;  
    margin-top: -10px;       /* fixed height */
    min-width: 3rem;      /* ensure flex doesn't shrink it */
    min-height: 3rem;     /* same */
    max-width: 3rem;      /* prevent expansion */
    max-height: 3rem;     /* prevent expansion */
    background: #00a7cc33;
    border-radius: 20%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;        /* icon font size */
    color: #2a6df4;
    flex-shrink: 0;          /* prevent shrinking in flex row */
  }
  .card-header {
    display: flex;
    align-items: center; /* vertical align text with icon */
    gap: 10px;           /* spacing */
    margin-bottom: 20px;
  }


    .test-card h3 {
      font-size: 16px;
      font-weight: 600;
      color: #000;
      margin-bottom: 6px;
      min-height: 40px; /* Keeps titles consistent */
    }
      .test-cards h3 {
      font-size: 16px;
      font-weight: 600;
      color: #000;
      line-height: 22px;
      margin-bottom: 6px;
      min-height: 40px; /* Keeps titles consistent */
    }
    

    .test-card p {
      font-size: 14px;
      color: #777;
      margin-bottom: 10px;
      min-height: 40px; /* Keeps text block same size */
    }

    /* Price area */
    .price {
      font-size: 23px;
      font-weight: 700;
      color: #000;
    }
  .price-blue {
      color: #00a8cc !important;
      font-size: 22px;
      font-weight: 900;
  }


    .old-price {
      text-decoration: line-through;
      color: #aaa;
      margin-left: 8px;
      font-size: 14px;
    }

    .discount {
      background-color: #ffe4c4;
      color: #ff6600;
      font-weight: 600;
      font-size: 12px;
      border-radius: 6px;
      padding: 3px 8px;
          float: right;
    }

    /* Buttons at bottom */
    .btn-group {
      display: flex;
      gap: 10px;
          height: 40px;
      margin-top: auto; /* pushes buttons to the bottom */
    }

    .btn-orange {
      background-color: #f67b1e;
      color: #fff;
      border: none;
        border-radius: 11px;
      padding: 10px 21px 10px 17px;
      font-weight: 600;
      font-size: 14px;
      cursor: pointer;
      transition: background 0.3s ease;
      flex: 1;
    }

    .btn-orange:hover {
      background-color: #e06f00;
    }

    .btn-outline {
      background: #fff;
      border: 1px solid #ddd;
      color: #333;
          border-radius: 11px;
      padding: 14px 21px;
      font-weight: 600;
      font-size: 14px;
      cursor: pointer;
      flex: 1;
    }

    .btn-outline:hover {
      color: #ffffffff;
      background-color: #00a8cc;
    }

    .common-test {
        text-align: center;
        padding: 60px 5%;
        background-color: #dfe0e14d;
  }
  .popup-container {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0,0,0,0.6);
    justify-content: center;
    align-items: center;
    z-index: 9999;
  }

  .popup-box {
    background: #fff;
    border-radius: 16px;
    padding: 30px 25px;
    width: 90%;
    max-width: 400px;
    text-align: center;
    box-shadow: 0 5px 20px rgba(0,0,0,0.2);
    animation: fadeIn 0.3s ease;
  }

  @keyframes fadeIn {
    from { opacity: 0; transform: scale(0.9); }
    to { opacity: 1; transform: scale(1); }
  }

  .close-btn {
      position: absolute;
      top: 10px;
      right: 12px;
      background: none;
      border: none;
      font-size: 22px;
      color: #555;
      cursor: pointer;
    }


    #pincodeInput {
      flex: 1;
      padding: 10px;
      border: none;
      outline: none;
    }


    .popup-container {
      display: none; /* Hidden by default */
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.6); /* semi-transparent overlay */
      justify-content: center;
      align-items: center;
      z-index: 9999; /* on top of everything */
    }

    /* Popup box (centered card) */
    .popup-box {
      background: #fff;
      padding: 30px 25px;
      border-radius: 16px;
      box-shadow: 0 5px 25px rgba(0, 0, 0, 0.2);
      width: 90%;
      max-width: 400px;
      text-align: center;
      position: relative;
      animation: popupFade 0.3s ease;
    }

    /* Smooth fade-in animation */
    @keyframes popupFade {
      from { transform: scale(0.9); opacity: 0; }
      to { transform: scale(1); opacity: 1; }
    }

    /* Close button (top right corner) */
    .close-btn {
      position: absolute;
      top: 10px;
      right: 12px;
      background: none;
      border: none;
      font-size: 22px;
      color: #666;
      cursor: pointer;
      transition: color 0.2s ease;
    }
    .close-btn:hover {
      color: #000;
    }


    #pincodeInput {
      border: none;
      outline: none;
      flex: 1;
      padding: 10px;
      font-size: 16px;
    }


    .popup-box p {
      font-size: 14px;
      color: #555;
      margin-bottom: 15px;
    }
    /* Popup background */
    .popup-container {
      position: fixed;
      inset: 0;
      background: rgba(0, 0, 0, 0.45);
      backdrop-filter: blur(3px);
      display: flex;
      align-items: center;
      justify-content: center;
      z-index: 9999;
    }


    .popup-box {
      background: #fff;
      padding: 2rem;
      border-radius: 18px;
      box-shadow: 0 4px 25px rgba(0, 0, 0, 0.2);
      max-width: 420px;
      width: 90%;
      text-align: center;
      position: relative;
      animation: fadeIn 0.3s ease;
    }

    /* Close button */
    .close-btn {
      position: absolute;
      top: 10px;
      right: 15px;
      background: transparent;
      border: none;
      font-size: 1.8rem;
      color: #333;
      cursor: pointer;
    }

    /* Title & subtitle */
    .popup-box h2 {
      margin-bottom: 0.3rem;
      color: #111;
      font-size: 1.4rem;
      font-weight: 700;
    }

    .sub-title {
      color: #777;
      font-size: 0.95rem;
      margin-bottom: 1rem;
    }

    /* Icon circle */
    .icon-circle {
      background: #ffe9e9;
      border-radius: 50%;
      width: 80px;
      height: 80px;
      margin: 0 auto 1rem auto;
      display: flex;
      align-items: center;
      justify-content: center;
    }



    /* Message content */
    .result-content h3 {
      color: #d32f2f !important;
      font-size: 1.1rem;
      font-weight: 600;
      margin-bottom: 0.5rem;
    }

    .result-content p {
      color: #555;
      font-size: 0.95rem;
      margin-bottom: 0.3rem;
    }

    .result-content .try {
      color: #888;
      font-size: 0.85rem;
      margin-top: 0.3rem;
    }

  /* Input group styling */
  .input-group {
    display: flex;
    align-items: center;
    border: 1px solid #ccc;
    border-radius: 17px;
    overflow: hidden;
    margin: 40px 0 0;
    transition: all 0.3s ease;
  }

  /* Force border color when active */
  .input-group.active {
    border: 3px solid #00a8cc !important;
    box-shadow: 0 0 5px rgba(0,168,204,0.5); /* subtle glow */
  }

  .input-group .icon {
    padding: 10px 12px;
    background: #ffffffff;
    font-size: 18px;
  }

  #pincodeInput {
    flex: 1;
    padding: 10px;
    border: none;
    outline: none;
    font-size: 16px;
  }
  .row:before {
      display: none !important;
      content: " ";
  }

  /* Verify Button */
  .verify-btn {
    margin-top: 1.2rem;
    background: #f36f21;              
    color: #fff;                      
    border: none;
    border-radius: 10px;
    padding: 0.7rem 1.4rem;
    font-size: 1rem;
    font-weight: bold;                
    cursor: pointer;
    transition: background 0.3s ease;
    width: 100%;
  }

  .verify-btn.active {
    background: #ff7a00;              
  }

  .verify-btn:hover {
    opacity: 0.9;
  }


    /* Animation */
    @keyframes fadeIn {
      from { opacity: 0; transform: translateY(-15px); }
      to { opacity: 1; transform: translateY(0); }
    }


  .icon-cross {
        display: inline-block;
        padding: 6px;
        border: 3px solid #ff3b3b;
        border-radius: 50%;
        background-color: #ffe9e9;
    }

    .icon-cross {
        color: #e50000;
        font-size: 1rem;
        font-weight: bold;
    }

    .popup-overlay {
      display: none;
      position: fixed;
      top: 0; left: 0;
      width: 100%; height: 100%;
      background: rgba(0,0,0,0.5);
      justify-content: center;
      align-items: center;
      z-index: 9999;
    }

    /* Popup box */
    .popup-content {
      background: #fff;
      padding: 30px 25px;
      border-radius: 12px;
      text-align: center;
      width: 350px;
      max-width: 90%;
      box-shadow: 0 5px 25px rgba(0,0,0,0.3);
      position: relative;
    }

    /* Close X button */
    .close-btn {
      position: absolute;
      top: 10px; right: 15px;
      font-size: 22px;
      font-weight: bold;
      cursor: pointer;
    }

    .tick-circle {
        background: #dcfce7;
        border-radius: 50%;
        width: 70px;
        height: 70px;
        margin: 0 auto 1rem auto;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .tick-cross {
        color: #15803d;
        font-size: 1rem;
        font-weight: bold;
    }
    .tick-cross {
        display: inline-block;
        padding: 6px;
        border: 3px solid #15803d;
        border-radius: 50%;
        background-color: #dcfce7;
    }



    /* Popup heading */
    .popup-content h3 {
      margin: 10px 0;
      color: #28a745; /* green heading */
      font-weight: 600;
    }

    /* Popup paragraph */
    .popup-content p {
      color: #555;
      margin-bottom: 20px;
    }

    /* Green button */
    .green-btn {
      background-color: #28a745;
      color: #fff;
      border: none;
      padding: 10px 22px;
      border-radius: 6px;
      cursor: pointer;
      font-size: 16px;
      font-weight: 500;
      width: 100%;
    }

    .green-btn:hover {
      background-color: #218838;
  }
  .toast {
      position: fixed;
      font-size: 13px;
      bottom: 15px;
      right: 15px;
      background-color: #fff; /* corrected color */
      color: black;
      padding: 23px 17px;
      border-radius: 8px;
      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
      opacity: 0;
      pointer-events: none;
      transform: translateY(20px);
      transition: opacity 0.5s, transform 0.5s;
      z-index: 10000; /* higher than .view-cart */
      cursor: pointer;
  }

  .toast.show {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
    }

    .toast.hide {
      opacity: 0;
      transform: translateX(200px);
    }
    .close-toast {
      position: absolute;
      top: 6px;
      right: 8px;
      cursor: pointer;
      font-size: 18px;
      font-weight: bold;
      opacity: 0;          /* 🔥 hidden by default */
      pointer-events: none; /* prevents accidental click */
      transition: 0.2s;
  }
  
  .toast:hover .close-toast {
      opacity: 1;          /* 🔥 show on hover */
      pointer-events: auto; /* allow click */
  }
  
  .view-cart {
    position: fixed;
    bottom: 15px;
    right: 15px;
    background: #ff6f00;
    color: #fff;
    font-weight: 600;
    font-size: 15px;
    border-radius: 50px;
    padding: 16px 11px;
    display: flex;
    align-items: center;
    gap: 13px;
    z-index: 9999;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    transition: all 0.3s ease;
  }

  .view-cart:hover {
    background: #ff8f00;
  }

  .cart-count {
      background: #00a8cc;
      color: #ffffff;
      font-size: 15px;
      font-weight: 700;
      border-radius: 50%;
      width: 22px;
      height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 3px;
  }

  .cart-total {
    margin-left: 5px;
    margin-right: 10px;
    font-size: 15px;
    font-weight: 600;
  }


  .cart-total span {
    margin-left: 0;
  }

  view-cart svg {
    font-size: 10px;

  }


  .cart-panel {
    position: fixed;
    top: 0;
    right: -440px; /* hidden by default */
    width: 440px;
    height: 100%;
    background: #fff;
    box-shadow: -6px 0 15px rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    transition: right 0.35s ease;
    z-index: 9999;
    border-left: 1px solid #eee;
    /* scroll inside panel only */
  }

  /* Slide in */
  .cart-panel.show {
    right: 0;
  }
  .cart-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6); /* slightly black */
    z-index: 9998; /* below cart panel */
    display: none; /* hidden by default */
  }
  .cart-overlay.show {
    display: block;
  }


  /* Footer-like summary */
  .vcart-summary {
      margin-top: 100%;
      padding: 18px 20px;
      border-top: 1px solid #eee;
      background: #fff;
      position: sticky;
      bottom: 0;
      z-index: 10;
      box-shadow: 0 -2px 6px rgba(0,0,0,0.05);
    }

    /* Original Price strikethrough */
    .original-price-summary {
      text-decoration: line-through;
      color: #777;
    }

    /* Savings green and with minus sign */
    .savings-price {
      color: green;
      font-weight: 600;
    }

    /* Book Now button */
    .book-now-btn {
      width: 100%;
      background: #ff7a00;
      color: #fff;
      border: none;
      border-radius: 6px;
      padding: 14px 0;
      font-size: 16px;
      font-weight: 600;
      margin-top: 14px;
      cursor: pointer;
      transition: 0.2s ease;
    }

    .book-now-btn:hover {
      background: #ff8c1a;
    }


    .cart-items {
      flex: 1;               /* take all remaining space */
      overflow-y: auto;      /* scroll items only */
      padding: 15px 20px;
    }




    .cart-panel.show {
      right: 0;
    }

    .cart-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 18px 20px;
      border-bottom: 1px solid #f1f1f1;
      background-color: #fff;
    }

    .cart-header h3 {
      font-size: 18px;
      font-weight: 600;
      margin: 0;
      color: #222;
    }

    .close-cart {
      font-size: 22px;
      cursor: pointer;
      color: #666;
      font-weight: 400;
      margin-top: -30px;
    }



    .original-price {
      color: #888;
      text-decoration: line-through;
      font-size: 14px;
    }

    .discounted-price {
      font-weight: 600;
      color: #000;
      font-size: 15px;
    }

    .remove-item {
      color: red;
      cursor: pointer;
      font-size: 16px;
    }

    .vcart-summary div {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin: 11px 0;
      color: #333;
      font-size: 14px;
    }

    .vcart-summary .original-price-summary {
      color: #888;
      text-decoration: line-through;
    }

    .vcart-summary .savings-price {
      color: #2ecc71; /* green */
      font-weight: 600;
    }

    .vcart-total {
      border-top: 1px solid #eee;
      margin-top: 10px;
      padding-top: 10px;
      font-size: 17px;
      font-weight: 800;
      color: #000;
    }

    .book-now-btn {
      width: 100%;
      background: #ff7a00;
      color: #fff;
      border: none;
      border-radius: 6px;
      padding: 14px 0;
      font-size: 16px;
      font-weight: 600;
      margin-top: 14px;
      cursor: pointer;
      transition: 0.2s ease;
    }

    .book-now-btn:hover {
      background: #ff8c1a;
    }


    .cart-header-text h3 {
      font-size: 18px;
      font-weight: 600;
      margin: 0;
      color: #222;
      margin-bottom: 15px;
    }

    .cart-subtitle {
      font-size: 14px;
      color: #555;
      margin-top: 4px;
    }



    .cart-item-details {
      display: flex;
      flex-direction: column;
      gap: 4px;
    }

    .cart-item-name {
      font-weight: 600;
      font-size: 15px;
      color: #222;
    }

    .cart-item-params {
      font-size: 13px;
      color: #555;
    }


    

    .cart-item-details {
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .cart-item-name {
      font-weight: 600;
      font-size: 15px;
      color: #222;
    }

    .cart-item-params {
      font-size: 13px;
      color: #555;
    }

    .cart-item-price {
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      gap: 4px;
    }

    .cart-item-price .current-price {
      font-weight: 600;
      font-size: 15px;
      color: #000;
    }

    .cart-item-price .original-price {
      text-decoration: line-through;
      color: #888;
      font-size: 13px;
    }

    .cart-item-price .discount {
      color: #16a34a; /* green */
      font-weight: 600;
      font-size: 13px;
    }


  .discounts {
      color: #16a34a; /* green */
      font-weight: 600;
      font-size: 13px;
    }
    .discounts {
      background-color: #dcfce7;
  
      font-weight: 600;
      font-size: 12px;
      border-radius: 6px;
      margin-left: 13px;
      padding: 3px 8px;

    }


  .cart-item-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 8px;               /* space between name and prices */
    }

    .cart-item-name {
        font-weight: 600;
        font-size: 1em;
        color: #333;
    }

    .cart-item {
        position: relative;               /* for absolute delete icon */
        background-color: #fff;           /* white card background */
        border: 2px solid #c3c3c3;          /* light border */
        border-radius: 8px;               /* rounded corners */

        padding: 28px 23px;               /* internal spacing */
        margin-bottom: 12px;              /* space between items */
        display: flex;
        flex-direction: column;           /* stack header and prices */
    }
    .cart-items {
        max-height: 60vh;      /* or whatever height you want for cart list */
        overflow-y: auto;      /* vertical scroll if items exceed height */
        padding-right: 25px;   /* optional, for scrollbar spacing */
    }


    .cart-item-header {
        font-weight: 600;
        font-size: 1em;
        color: #333;
        margin-bottom: 8px;
    }

.cart-item-remove {
    position: absolute;
    top: 25px;
    right: 25px;
    width: 30px;
    height: 30px;
    cursor: pointer;
    color: #ff5722;
    font-size: 1.2em;

    display: flex;                /* centers content */
    align-items: center;          /* vertically center */
    justify-content: center;      /* horizontally center */

      /* blue circle */
    border-radius: 50%;           /* perfect circle */
    transition: background 0.2s ease;
}


.cart-item-remove:hover {
    background: #00a8cc;    /* blue circle on hover */
    color: #fff;            /* optional: icon turns white */
}



    .cart-item-prices {
        display: flex;                    /* horizontal row */
        gap: 12px;                         /* space between prices */
        align-items: center;
        margin-top: 2px;
        flex-wrap: nowrap;                 /* stay in single line */
    }

    .current-price {
        font-weight: bold;
        color: #000000ff;
    }

    .original-price {
        text-decoration: line-through;
        color: #999;
    }

    .discount-label {
        color: #15803d;
        line-height: 1.25rem;
        font-size: 0.75rem;
        background-color: #dcfce7;
  }
  .poplab-heading {
      color: #101111;
      font-weight: bold;
      font-size: 36px;
      margin-top: 1px;
      margin-bottom: 20px;
      text-align: center;
  }


  /* SEARCH PART */
  /* Background */
  .findtest-search-bg {
    background: linear-gradient(to right, #00a7cc1a, #ffffff);
    padding: 60px 0 1px 0; 
    text-align: center;
  }

  /* Container */
  .findtest-search-container {
    max-width: 750px;
    margin: 0 auto;
  }

  /* Title & subtitle */
  .findtest-title {
    font-size: 36px;
    font-weight: 700;
    color: #222;
    margin-bottom: 10px;
  }

  .findtest-subtitle {
    color: #555;
    font-size: 16px;
    margin-bottom: 40px;
  }

  /* Search box wrapper */
  .findtest-search-box {
    justify-content: center;
    align-items: center;
  }

  .findtest-input-wrapper {
    position: relative;
    width: 100%;
    max-width: 1240px; /* ✅ Wider search bar */
    margin: 0 auto;
        margin-bottom: 50px;
  }

  .findtest-input {
    width: 100%;
    height: 55px; /* ✅ Taller input field */
    padding: 0 70px; /* ✅ Room for search + clear icons */
    border: 2px solid #bcbcbc;
    border-radius: 50px;
    font-size: 15px;
    outline: none;
    background-color: #fff;
    box-sizing: border-box;
    transition: all 0.3s ease;
    color: #000;
  }

  /* Gray placeholder + gray icons look */
  .findtest-input::placeholder {
    color: #9b9b9b;
  }

  .findtest-input:focus {
    border: 0.1px solid #9fe1f0ff;       /* Inner thin blue border */
    outline: 3px solid #ffffff;       /* White gap */
    outline-offset: 3px;
    box-shadow: 0 0 0 7px #00a8cc;    /* Outer thick blue border */
  }




  /* ✅ Search icon style */
  .findtest-icon {
    position: absolute;
    left: 25px;
    top: 50%;
    transform: translateY(-50%);
    color: #9b9b9b;
    font-size: 22px;
  }

  /* ✅ Clear (×) icon style */
  .findtest-clear {
    position: absolute;
    right: 25px;
    top: 50%;
    transform: translateY(-50%);
    color: #9b9b9b;
    font-size: 22px;
    cursor: pointer;
  }



  /* Search icon */
  .findtest-search-icon {
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    color: #888;
    font-size: 20px;
  }

  /* Clear button */
  .findtest-clear-btn {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #888;
    font-size: 20px;
    cursor: pointer;
  }

  .findtest-clear-btn:hover {
    color: #007bff;
  }

  /* Hint box */
  .findtest-hintbox {
    display: none;
    margin-top: 15px;
    background: #f8f9fa;
    border: 1px solid #ddd;
    border-radius: 10px;
    padding: 12px 15px;
    font-size: 14px;
    color: #555;
    width: 100%;
    max-width: 850px;
    margin-left: auto;
    margin-right: auto;
  }
  .para {
    font-size: 19px;
    line-height: 30px;
      margin-bottom: 35px;
  }
  .result-count-container{
    width: 27%;
      margin-bottom: 10px;
  }

  .lab-deck {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* center the cards */
    gap: 10px;               /* 10px gap between cards */
    width: 87%;              /* container width */
    margin: 0 auto;          /* center container on page */
  }

  .test-cards {

    box-sizing: border-box;
    height: 250px !important;
  }
.rc-accordion-group {
    margin-top: 10px;
    font-family: Arial, sans-serif;
}

.rc-accordion-item {
    border: 2px solid #ddd;
    border-radius: 6px;
    margin-bottom: 6px;
    background: #fff;
}


.rc-accordion-title a {
    font-size: 16px;
    font-family: 'poppins', sans-serif;
    font-weight: 600;
    color: #000;
    text-decoration: none;
    display: block;
    position: relative;
    padding-right: 25px;
}

.rc-accordion-title a::after {
    content: "";
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%) rotate(45deg);
    width: 8px;
    height: 8px;
    border-right: 2px solid #333;
    border-bottom: 2px solid #333;
    transition: transform 0.2s ease;
}

.rc-accordion-title a[aria-expanded="true"]::after {
    transform: translateY(-50%) rotate(-135deg);
}

.rc-accordion-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.rc-accordion-content {
    padding: 10px 16px;
    background: #fff;
}

.rc-subtest-list {
    list-style-type: disc;
    padding-left: 20px;
    margin: 0;
}

.rc-subtest-list li {
    margin-bottom: 5px;
    font-size: 14px;
}

.rc-no-subtext {
    color: #777;
    font-style: italic;
    margin: 0;
    font-size: 14px;
}


/* ---------- ACCORDION ITEM ---------- */
.rc-accordion-item {
    border: 3px solid #ddd;
    border-radius: 10px;
    margin-bottom: 6px;
    background: #fff;
}

/* ---------- HEADER ---------- */
.rc-accordion-header {
    padding: 13px 15px;
    cursor: pointer;
    width: 96%;
    margin-left: 16px;
    background: #ffffffff;
}
.rc-accordion-title{
  font-size: 17px;
}

.why-test-hr-blue {
    border: none;
    height: 3px;
    background-color: #00a8cc;
}
.redcl{
  margin-bottom: 30px;
}

.test-page {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}

.features {
    text-align: left;
}
@media (max-width: 768px) {
    .toast {
        top: 10px;
        width: 90%;
        height: 20%;
        left: 0;
        right: 0;
        margin: 0 auto;
        transform: translateY(-20px);
        border: 1px solid #e6e6e6;   /* you can change color and thickness */
        border-radius: 8px;          /* optional, match existing style */
    }

  .findtest-search-bg {
      background: linear-gradient(to right, #00a7cc1a, #ffffff);
      padding: 36px 0;      
  }
  .how-it-works h2 {
    font-size: 1.875rem;
  }

  .findtest-subtitle {
      margin: 2%;
      margin-bottom: 26px;
  }
  .card-header {

      margin-bottom: 1px;
  }
  .lab-deck {
            /* 10px gap between cards */
    width: 99%;              /* container width */
        /* center container on page */
  }
  .test-cards {
      width: 98%;
  height: 210px !important;
      margin: 2%;
  }
  .price-blue {
      font-size: 20px;
  }
  .btn-orange {

      border-radius: 10px;
  }
  .result-count-container{
    width: 40%;

  }
  .btn-outline {

      border-radius: 10px;
  }
  .common-test {

      padding: 12px 2%;
  }
  .poplab-heading {
      font-size: 28px;
      margin-top: 30px;
  }
  .btn-group {
      margin-top: 6%;
  }
  .how-it-works {
      padding: 31px 4%;
  }
  .step-card {
          width: 99%;
          max-width: 388px;
      box-shadow: 0 4px 20px rgba(0, 0, 0, 0.19);
  }
  .patient-reviews {
      padding: 35px 0%;
  }
  .patient-reviews h2 {
      font-size: 1.8rem;
  }
      .review-card {
          width: 90%;
          max-width: 400px;
      }
  .review-author {

      text-align: center;
  }
  .stars {

      text-align: center;
  }

  .review-author {
  
      text-align: center;
      
  }
  .review-text {

      text-align: center;
      font-size: 0.79rem;
  }
  .review-card .quote {
      width: 337px;}
  .rating-text {

      font-size: 0.8rem;

  }
  .rating-score {
      font-size: 0.9rem;
  }
  .star-icon {
      font-size: 18px;
  }
  .rating-summary {

      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.18)

  }

  .faq-section {

      margin: 30px auto;
  line-height: 40px;
  }
  .blogs-section h2 {
      font-size: 1.5rem;
  }

  .blogs-section p {

      font-size: 0.90rem;}



  .blogs-section {
      background: #f9fafa;
      padding: 3rem 1rem;
  }
  .blog-image {

      height: 240px;
  }
  .blogs-section p {
          font-size: 0.80rem;
      }
  .blog-footer {

      font-size: 13px;
  }
  .control h1 {
      font-size: 1.6rem;
      line-height: 33px;
      margin-bottom: 18px;
  }
  .view-all {
      margin-top: 2.5rem;
  }
  .faq-question {

      font-size: 1rem;

      padding: 21px 14px;
      }
  .view-cart {
      font-size: 13px;
      padding: 11px 11px;
  }
  .cart-total {
      font-size: 13px;
  }
  .cart-count {
      font-size: 13px;
      width: 20px;
      height: 20px;
  }
  .cart-items {

      margin: 2%;
  }
  .cart-header {

      margin: 3%;
  }
  .lab-hero {
      padding: 60px 6%;
  }
    .close-cart {

      margin-top: -9px;
    }

    .carousel-wrapper {
        gap: 15px;
        padding: 0 0px;
        justify-content: flex-start;
    }
    .packpoplab-heading {
    font-size: 1.875rem;
    }

    .item, .dg-card {
        width: 90%;
        max-width: 320px;
        min-height: 470px; /* same height for all cards */
    }

    .carousel-arrow.prev { left: 5px; }
    .carousel-arrow.next { right: 5px; }

              .badge {
              margin-top: 6% !important;
          }
}
@media (max-width: 380px) {
.item {
    min-width: 340px;
    display: flex;
    justify-content: center;
}
}

@media (max-width: 550px) {
    .carousel-wrapper {
        gap: 10px;                  /* smaller gaps */
        padding: 0 px;             /* minimal padding */
        scroll-snap-type: x mandatory;
        overflow-x: auto;
    }


    .item {
        flex: 0 0 90%;               /* each card takes 90% width */
        max-width: 280px;            /* limit card width */
        scroll-snap-align: start;
        display: flex;
        justify-content: center;
    }

    .dg-card {
        width: 100%;                 /* full width of .item */
        max-width: 330px;
        min-height: 470px;           /* uniform height */
        padding: 25px 15px;          /* smaller padding */
        border-radius: 20px;
        box-sizing: border-box;
    }

    .dg-mostpopular-badge {
        top: 0;
        right: 0;
        padding: 6px 12px;           /* smaller badge */
        font-size: 12px;
        border-top-right-radius: 20px;
        border-bottom-right-radius: 0;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

    .carousel-arrow.prev { left: 0;
      display: none;
     }
    .carousel-arrow.next { right: 0; 
    display: none;
  
  }
  .carousel-container {
    position: relative;
    overflow: visible;
    padding: 0 0px;
}
    .findtest-title {
      font-size: 28px;
    }
    .findtest-input {
      font-size: 15px;
      padding: 12px 45px;
    }
    .findtest-input-wrapper {
      max-width: 90%;
    }
      .review-card .quote {
      width: 275px !important;}


}   
@media (max-width: 992px) {
      .steps {
        gap: 25px;
      }

      .step-card {
        width: 90%;
        max-width: 320px;
      }

      .reviews-container {
        gap: 20px;
      }

      .review-card {
        width: 90%;
        max-width: 320px;
      }
}
@media (max-width: 600px) {
      .test-card {
        width: 96%;
        height: auto;
      }
}
@media (max-width: 768px) {
      .popup-box {
        width: 90%;
        padding: 1.5rem;
      }
      .rc-accordion-title{
  font-size: 15px;
}

.rc-accordion-item {
    border: 2px solid #ddd;

}
.btn-orange-col {
    font-size: 14px !important;
}

}

.empty-cart {
  text-align: center;
  padding: 116px 20px;
  animation: fadeIn 0.4s ease-in-out;
}

.empty-cart .icon-wrapper {
  margin-bottom: 20px;
}

.empty-cart h3 {
  font-size: 22px;
  font-weight: 600;
  color: #111;
  margin-bottom: 10px;
}

.empty-cart p {
  font-size: 15px;
  color: #6c7380;
  margin: 0;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
.empty-cart {
    overflow-y: hidden !important;
}

.findtest-input-wrapper {
  position: relative;
}

.clear-icon {
  position: absolute;
  right: 30px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 25px;
  color: #888;
  cursor: pointer;
  display: none; /* hidden by default */
}
.btn-orange-col {
    background-color: #f67b1e;
    color: #fff;
    border: none;
    border-radius: 11px;
    padding: 16px 40px 16px 40px;
    font-weight: 600;
    font-size: 17px;
    cursor: pointer;
    transition: background 0.3s 
ease;
    flex: 1;
}