/* common css start */

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  overflow-x: hidden;
  font-family: "Poppins", sans-serif;
}
a {
  text-decoration: none;
}
ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
img {
  vertical-align: middle;
}

.px-50 {
  padding-left: 50px;
  padding-right: 50px;
}

/* common css end */

/* top bar */
#quicktech-top-bar {
  background-color: #21428a;
  padding: 5px 0;
}

.quicktech-top-left p img {
  height: 16px;
}

.quicktech-top-left p {
  margin-bottom: 0 !important;
  color: white;
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 9px;
  justify-content: left;
}

.quicktech-top-right p {
  margin-bottom: 0 !important;
  color: white;
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 9px;
  justify-content: end;
}

.quicktech-top-right p img {
  height: 16px;
}
/* top bar */

/* navbar */

.quicktech-desktop-nav {
  background-color: #ffffff;
  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.04);
  padding: 12px 0;
  position: sticky;
  top: 0;
  z-index: 99;
}

/* Left Side: Brand Styling */
.quicktech-desktop-nav .logo-icon {
  font-size: 38px;
  color: #21428a;
  margin-right: 14px;
}
.quicktech-desktop-nav .brand-name {
  font-size: 25px;
  font-weight: 700;
  color: #21428a;
  line-height: 1;
  margin-bottom: 3px;
}
.quicktech-desktop-nav .brand-tagline {
  font-size: 11.5px;
  color: #4a5568;
  letter-spacing: 0.3px;
  font-weight: 500;
}

/* Center Navigation Menu */
.quicktech-desktop-nav .nav-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  gap: 25px;
  align-items: center;
}
.quicktech-desktop-nav .nav-list li a {
  text-decoration: none;
  color: #0f2942;
  font-weight: 600;
  font-size: 14.5px;
  transition: color 0.2s ease;
}
.quicktech-desktop-nav .nav-list li a:hover {
  color: #21428a;
}

/* Dropdown Setup on Hover */
.quicktech-desktop-nav .dropdown {
  position: relative;
}
.quicktech-desktop-nav .dropdown-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  background: #ffffff;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
  border: none;
  border-radius: 12px;
  min-width: 313px;
  padding: 12px;
  margin-top: 10px;
  z-index: 1000;
}

/* Keep dropdown open when transitioning cursor */
.quicktech-desktop-nav .dropdown::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 15px;
  bottom: -15px;
  left: 0;
}
.quicktech-desktop-nav .dropdown:hover .dropdown-menu {
  display: block;
}

/* -------------------------------------
   SUB-DROPDOWN & CHILD MENU STYLES
   ------------------------------------- */

.quicktech-desktop-nav .sub-dropdown {
  position: relative;
}

.quicktech-desktop-nav .child-dropdown-menu {
  display: none;
  position: absolute;
  top: 0;
  left: 100%;
  background: #ffffff;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
  border: none;
  border-radius: 12px;
  min-width: 240px;
  padding: 12px;
  margin-left: 5px; /* Small gap between main menu and child menu */
  z-index: 1001;
}

/* Invisible bridge for child dropdown to prevent hover drop-off */
.quicktech-desktop-nav .sub-dropdown::after {
  content: "";
  position: absolute;
  width: 20px;
  height: 100%;
  top: 0;
  right: -20px;
  z-index: 1002;
}

/* Show child dropdown on hover */
.quicktech-desktop-nav .sub-dropdown:hover .child-dropdown-menu {
  display: block;
}

/* Utility to push chevron to the right */
.quicktech-desktop-nav .ms-auto {
  margin-left: auto;
  font-size: 12px;
  color: #94a3b8;
}

/* -------------------------------------
   ITEM & TYPOGRAPHY STYLES
   ------------------------------------- */

/* Image-Exact Custom Dropdown Item Layout */
.quicktech-desktop-nav .dropdown-item-custom {
  display: flex;
  align-items: center;
  padding: 9px 8px;
  text-decoration: none;
  border-radius: 8px;
  transition: background-color 0.2s ease;
}
.quicktech-desktop-nav .dropdown-item-custom:hover {
  background-color: #f8fafc;
}

/* Icon Box Frame */
.quicktech-desktop-nav .dropdown-icon-box {
  width: 42px;
  height: 42px;
  background-color: #f1f5f9; /* Subtle light background box */
  border-radius: 10px; /* Rounded corners from image */
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 16px;
  font-size: 17px;
  flex-shrink: 0;
}

/* Typography Content */
.quicktech-desktop-nav .dropdown-text {
  font-size: 15px;
  font-weight: 600;
  color: #0a2540; /* Accurate Dark Blue Text */
}

/* Right Side: Navigation utilities */
.quicktech-desktop-nav .action-section {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 22px;
}

/* Animated Expandable Search Input */
.quicktech-desktop-nav .search-container {
  position: relative;
  display: flex;
  align-items: center;
}
.quicktech-desktop-nav .search-icon-btn {
  cursor: pointer;
  color: #0f2942;
  font-size: 18px;
  transition: color 0.2s;
  z-index: 2;
}
.quicktech-desktop-nav .search-icon-btn:hover {
  color: #21428a;
}
.quicktech-desktop-nav .search-input-field {
  width: 0;
  opacity: 0;
  padding: 0;
  border: none;
  border: 1px solid #21428a85;
  background: transparent;
  outline: none;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: absolute;
  right: 28px;
  font-size: 14px;
  z-index: 1;
  border-radius: 20px;
}
.quicktech-desktop-nav .search-input-field.active {
  width: 221px;
  opacity: 1;
  padding: 9px 8px;
  background-color: white;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  padding-left: 16px;
}

/* Separation Line */
.quicktech-desktop-nav .vertical-divider {
  width: 1px;
  height: 32px;
  background-color: #e2e8f0;
}

/* Emergency Block Elements */
.quicktech-desktop-nav .emergency-contact {
  display: flex;
  align-items: center;
  gap: 12px;
}
.quicktech-desktop-nav .emergency-contact i {
  font-size: 22px;
  color: #21428a;
}
.quicktech-desktop-nav .emergency-text-group {
  display: flex;
  flex-direction: column;
  line-height: 1.25;
}
.quicktech-desktop-nav .emergency-label {
  font-size: 11px;
  color: #718096;
  font-weight: 500;
}
.quicktech-desktop-nav .emergency-number {
  font-size: 16px;
  font-weight: 700;
  color: #c53030;
}

/* Custom WhatsApp Block Frame */
.quicktech-desktop-nav .whatsapp-btn {
  background-color: #25d366;
  color: #ffffff;
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-size: 22px;
  text-decoration: none;
  transition: background-color 0.2s ease;
}
.quicktech-desktop-nav .whatsapp-btn:hover {
  background-color: #1ebd5a;
  color: #ffffff;
}

.quikctech-desktop-logo img {
  height: 51px;
}

/* navbar */

/* banner */
.quicktech-banner-swiper {
  width: 100%;
  height: 600px; /* Adjust global banner height here */
  position: relative;
  overflow: hidden;
}

/* Relative parent for absolute layouts */
.quicktech-banner-slide {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: #f8fafc;
}

/* Absolute background image taking full width/height */
.quicktech-banner-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center right;
  background-repeat: no-repeat;
  z-index: 1;
}

/* Individual slide backgrounds (Replace with actual URLs) */

/* Absolute text content layout */
.quicktech-banner-content {
  position: absolute;
  left: 8%;
  top: 75%;
  transform: translateY(-50%);
  z-index: 2;
  width: 50%;
  max-width: 650px;
}

.quicktech-banner-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background-color: #21428a1c;
  color: #21428a;
  padding: 6px 16px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 24px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.quicktech-banner-title {
  font-size: 46px;
  color: #0f172a;
  line-height: 1.25;
  margin-bottom: 20px;
  font-weight: 700;
}

.quicktech-banner-highlight {
  color: #21428a;
}

.quicktech-banner-desc {
  font-size: 16px;
  color: #475569;
  line-height: 1.6;
  margin-bottom: 35px;
  font-weight: 400;
}

.quicktech-banner-features {
  display: flex;
  gap: 25px;
  margin-bottom: 45px;
}

.quicktech-banner-feature-item {
  display: flex;
  align-items: center;
  gap: 12px;
}

.quicktech-banner-icon {
  background-color: #21428a12;
  color: #21428a;
  width: 45px;
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-size: 18px;
}

.quicktech-banner-text {
  font-size: 13px;
  color: #1e293b;
  font-weight: 600;
  line-height: 1.3;
}

.quicktech-banner-text span {
  font-weight: 400;
  color: #64748b;
}

/* Fixed Button Layout across all slides */
.quicktech-banner-buttons {
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
}

.quicktech-banner-btn {
  padding: 14px 22px;
  border-radius: 6px;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: all 0.3s ease;
}

.quicktech-banner-btn-solid {
  background-color: #21428a;
  color: #ffffff;
  border: 1px solid #21428a;
}

.quicktech-banner-btn-solid:hover {
  background-color: white;
  border-color: #21428a;
  color: #21428a;
}

.quicktech-banner-btn-outline {
  background-color: white;
  color: #21428a;
  border: 1px solid #21428a;
}

.quicktech-banner-btn-outline:hover {
  background-color: #21428a;
  color: #ffffff;
  border: 1px solid #21428a;
}

/* Swiper Navigation Custom Colors */
.quicktech-banner-swiper .swiper-pagination-bullet-active {
  background: #21428a;
}

/* Responsive Adjustments */
@media (max-width: 1200px) {
  .quicktech-banner-title {
    font-size: 38px;
  }
  .quicktech-banner-content {
    width: 60%;
  }
}

@media (max-width: 992px) {
  .quicktech-banner-content {
    width: 85%;
    left: 5%;
    background: rgba(255, 255, 255, 0.9);
    padding: 30px 20px;
    border-radius: 15px;
    backdrop-filter: blur(5px);
  }
  .quicktech-banner-features {
    flex-wrap: wrap;
  }
}

@media (max-width: 768px) {
 .quicktech-banner-swiper {
	height: 150px;
	min-height: 100%;
}
  .quicktech-banner-title {
    font-size: 18px !important;
  }
  .quicktech-banner-content {
    top: 5%;
    transform: none;
    position: relative;
    width: 90%;
    margin: 20px auto;
  }
  .quicktech-banner-bg {
    position: unset !important;
    height: 100%;
  }
  .quicktech-banner-slide {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
}

/* banner */

/* service */
.quicktech-service-badge {
  background-color: #f1f5f9;
  color: #475569;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1px;
  padding: 6px 16px;
  border-radius: 20px;
  display: inline-block;
  margin-bottom: 15px;
  text-transform: uppercase;
}

.quicktech-service-title {
  color: #0f172a;
  font-size: 32px;
  font-weight: 700;
  margin-bottom: 12px;
}

.quicktech-service-subtitle {
  color: #475569;
  font-size: 15px;
  max-width: 600px;
  margin: 0 auto 45px auto;
  font-weight: 400;
}

/* 7-Column Responsive Flex Grid Wrapper */
.quicktech-service-grid {
  display: grid;

  justify-content: center;
  gap: 16px;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
}

/* Card Styles */
.quicktech-service-card {
  flex: 1 1 calc(14.28% - 16px); /* Perfect mathematical split for 7 columns on desktop */

  background-color: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 24px 14px 20px 14px;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  transition: all 0.3s ease;
}

.quicktech-service-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);
}

/* Circular Image Wrapper */
.quicktech-service-img-wrapper {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}

/* Using actual <img> tags inside the content as requested */
.quicktech-service-img {
  width: 45px;
  height: 45px;
  object-fit: contain;
}

.quicktech-service-card-title {
  color: #0f172a;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 12px;
  min-height: 42px; /* Standardizes text height alignment */
  display: flex;
  align-items: center;
  justify-content: center;
}

.quicktech-service-card-desc {
  color: #64748b;
  font-size: 12px;
  line-height: 1.5;
  margin-bottom: 20px;
  font-weight: 400;
  min-height: 54px; /* Standardizes description height alignment */
}

/* Card Bottom Button */
.quicktech-service-btn {
  font-size: 13px;
  font-weight: 600;
  color: #21428a;
  background-color: white;
  border: 1px solid #e2e8f0;
  padding: 6px 16px;
  border-radius: 6px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: all 0.2s ease;
  width: 100%;
  justify-content: center;
}

.quicktech-service-btn:hover {
  background-color: #21428a;
  color: #ffffff;
  border-color: #21428a;
}

/* --- Individual Color Themes Mapped to image_c49c21.png --- */

/* 1. Medicine Delivery (Light Teal) */
.quicktech-service-med {
  background-color: #21428a12;
  border-color: #ccfbf1;
}
.quicktech-service-med .quicktech-service-img-wrapper {
  background-color: #ccfbf1;
}

/* 2. Beauty & Personal Care (Light Pink) */
.quicktech-service-beauty {
  background-color: #fff1f2;
  border-color: #ffe4e6;
}
.quicktech-service-beauty .quicktech-service-img-wrapper {
  background-color: #ffe4e6;
}

/* 3. Nursing Care (Light Cyan) */
.quicktech-service-nursing {
  background-color: #ecfeff;
  border-color: #cffafe;
}
.quicktech-service-nursing .quicktech-service-img-wrapper {
  background-color: #cffafe;
}

/* 4. Physiotherapy (Light Purple) */
.quicktech-service-physio {
  background-color: #f5f3ff;
  border-color: #ede9fe;
}
.quicktech-service-physio .quicktech-service-img-wrapper {
  background-color: #ede9fe;
}

/* 5. Blood Donation (Light Peach/Red) */
.quicktech-service-blood {
  background-color: #fff5f5;
  border-color: #fed7d7;
}
.quicktech-service-blood .quicktech-service-img-wrapper {
  background-color: #fed7d7;
}

/* 6. Blood Collection (Light Aqua) */
.quicktech-service-collect {
  background-color: #f0fdf4;
  border-color: #dcfce7;
}
.quicktech-service-collect .quicktech-service-img-wrapper {
  background-color: #dcfce7;
}

/* 7. Lab Test Booking (Light Grey-Blue) */
.quicktech-service-lab {
  background-color: #f8fafc;
  border-color: #f1f5f9;
}
.quicktech-service-lab .quicktech-service-img-wrapper {
  background-color: #e2e8f0;
}

@media (max-width: 1200px) {
  .quicktech-service-card {
    flex: 1 1 calc(25% - 16px);
  } /* 4 columns on small desktop */
}
@media (max-width: 992px) {
  .quicktech-service-card {
    flex: 1 1 calc(33.33% - 16px);
  } /* 3 columns on tablets */
  .quicktech-service-title {
    font-size: 28px;
  }
}
@media (max-width: 576px) {
  .quicktech-service-card {
    flex: 1 1 calc(50% - 16px);
  } /* 2 columns on mobile devices */
  .quicktech-service-title {
    font-size: 21px;
  }
}

/* service */

/* emergency */

.quicktech-emergency-card {
  border-radius: 16px;
  padding: 30px 24px;
  display: flex;
  align-items: center;
  gap: 20px;
  height: 100%;
  border: none;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.quicktech-emergency-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.04);
}

/* Illustration Wrapper */
.quicktech-emergency-img-wrapper {
  flex-shrink: 0;
  width: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.quicktech-emergency-img {
  width: 100%;
  height: auto;
  object-fit: contain;
}

/* Text Block Content */
.quicktech-emergency-content {
  flex-grow: 1;
}

/* Title Pills matching the soft glowing background behind headings */
.quicktech-emergency-title-pill {
  display: inline-block;
  font-size: 17px;
  font-weight: 600;
  padding: 4px 17px;
  border-radius: 20px;
  margin-bottom: 10px;
}

.quicktech-emergency-desc {
  color: #475569;
  font-size: 14px;
  line-height: 1.5;
  margin-bottom: 18px;
  font-weight: 400;
}

/* Action Buttons */
.quicktech-emergency-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 18px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.2s ease;
  background-color: #ffffff;
}

/* --- Individual Card Variations --- */

/* Card 1: Prescription Upload (Mint Theme) */
.quicktech-emergency-prescription {
  background-color: #21428a12; /* Light mint tint */
}
.quicktech-emergency-prescription .quicktech-emergency-title-pill {
  color: #21428a;
  background-color: #21428a42;
}
.quicktech-emergency-prescription .quicktech-emergency-btn {
  color: #21428a;
  border: 1px solid #21428a;
}
.quicktech-emergency-prescription .quicktech-emergency-btn:hover {
  background-color: #21428a;
  color: #ffffff;
}

/* Card 2: Emergency Support (Orange Theme) */
.quicktech-emergency-support {
  background-color: #fff7f0; /* Light orange tint */
}
.quicktech-emergency-support .quicktech-emergency-title-pill {
  color: #d9531e;
  background-color: #ffebd9;
}
.quicktech-emergency-support .quicktech-emergency-btn {
  color: #d9531e;
  border: 1px solid #d9531e;
}
.quicktech-emergency-support .quicktech-emergency-btn:hover {
  background-color: #d9531e;
  color: #ffffff;
}

/* Card 3: Home Collection (Teal Blue Theme) */
.quicktech-emergency-collection {
  background-color: #eff9f9; /* Light aqua/teal tint */
}
.quicktech-emergency-collection .quicktech-emergency-title-pill {
  color: #00838f;
  background-color: #e0f7fa;
}
.quicktech-emergency-collection .quicktech-emergency-btn {
  color: #00838f;
  border: 1px solid #00838f;
}
.quicktech-emergency-collection .quicktech-emergency-btn:hover {
  background-color: #00838f;
  color: #ffffff;
}

/* emergency */

/* works */

.quicktech-works-badge {
  background-color: #f1f5f9;
  color: #64748b;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1px;
  padding: 5px 16px;
  border-radius: 20px;
  display: inline-block;
  margin-bottom: 15px;
  text-transform: uppercase;
}

/* --- Left Side Content Area (How It Works) --- */
.quicktech-works-left-side {
  padding-right: 40px;
}

.quicktech-works-title {
  color: #0f172a;
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 40px;
}

/* Horizontal Layout for Steps Flow */
.quicktech-works-steps-flow {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.quicktech-works-step-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  flex: 1;
}

/* Circular background container for illustrations */
.quicktech-works-icon-circle {
  width: 54px;
  height: 54px;
  background-color: #21428a29;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.quicktech-works-icon-circle img {
  width: 26px;
  height: 26px;
  object-fit: contain;
}

.quicktech-works-step-meta {
  font-size: 11px;
  font-weight: 600;
  color: #64748b;
  margin-bottom: 2px;
  display: block;
}

.quicktech-works-step-title {
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 6px;
}

.quicktech-works-step-desc {
  font-size: 12px;
  color: #64748b;
  line-height: 1.5;
  margin: 0;
}

/* Step Connecting Arrow Utility */
.quicktech-works-step-arrow {
  display: flex;
  align-items: center;
  align-self: center;
  color: #cbd5e1;
  font-size: 14px;
  margin-bottom: 20px;
  flex-shrink: 0;
}

/* --- Right Side Content Area (Trust Metrics) --- */
.quicktech-works-right-side {
  padding-left: 40px;
}

/* 4 Statistics Container Grid Row Layout */
.quicktech-works-stats-row {
  display: flex;
  gap: 12px;
  margin-bottom: 30px;
}

.quicktech-works-stat-card {
  flex: 1;
  background-color: #f8fafc;
  border: 1px solid #f1f5f9;
  border-radius: 12px;
  padding: 20px 10px;
  text-align: center;
  transition: all 0.2s ease;
}

.quicktech-works-stat-card:hover {
  background-color: #ffffff;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.03);
  border-color: #e2e8f0;
}

.quicktech-works-stat-number {
  font-size: 27px;
  font-weight: 700;
  color: #21428a;
  margin-bottom: 4px;
  display: block;
}

.quicktech-works-stat-label {
  font-size: 11px;
  font-weight: 500;
  color: #475569;
  margin-bottom: 0;
  line-height: 1.3;
}

/* Reviews Panel & Avatar Overlay Stack Row Layout */
.quicktech-works-reviews-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 15px;
}

.quicktech-works-rating-info {
  display: flex;
  align-items: center;
  gap: 10px;
}

.quicktech-works-stars {
  color: #ffb300; /* Warm golden star color */
  font-size: 16px;
  display: flex;
  gap: 2px;
}

.quicktech-works-rating-text {
  font-size: 14px;
  color: #475569;
  margin-bottom: 0;
}

.quicktech-works-rating-text strong {
  color: #0f172a;
  font-weight: 700;
}

/* Stacked Avatar Elements */
.quicktech-works-avatar-stack {
  display: flex;
  align-items: center;
}

.quicktech-works-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 2px solid #ffffff;
  object-fit: cover;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.quicktech-works-avatar:not(:first-child) {
  margin-left: -12px; /* Pulls images leftward over each other */
}

/* --- Desktop Vertical Split Border Line Configuration --- */
@media (min-width: 992px) {
  .quicktech-works-border-right {
    border-right: 1px solid #e2e8f0;
  }
}

/* Responsive Breakpoint Adaptations */
@media (max-width: 992px) {
  .quicktech-works-left-side {
    padding-right: 0;
    margin-bottom: 50px;
  }
  .quicktech-works-right-side {
    padding-left: 0;
  }
}

@media (max-width: 768px) {
  .quicktech-works-steps-flow {
    flex-direction: column;
    gap: 20px;
  }
  .quicktech-works-step-arrow {
    transform: rotate(90deg);
    margin: 0 auto;
    align-self: center;
  }
  .quicktech-works-stats-row {
    flex-wrap: wrap;
  }
  .quicktech-works-stat-card {
    flex: 1 1 calc(50% - 12px);
  }
}

/* works */

/* testimonial */
.testimonial-header {
  text-align: center;
  position: relative;
  margin-bottom: 20px;
}

.badge {
  background-color: #f1f5f9;
  color: #475569;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1px;
  padding: 6px 16px;
  border-radius: 20px;
  display: inline-block;
  margin-bottom: 15px;
  text-transform: uppercase;
}

.title-row {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

.title-row h2 {
  color: #1a202c;
  font-size: 28px;
  font-weight: 700;
  margin: 0;
}

.view-all {
  position: absolute;
  right: 0;
  color: #21428a;
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 4px;
}

.view-all:hover {
  text-decoration: underline;
}

/* --- Slider & Card Styling --- */
.slider-container {
  position: relative;
  padding: 10px 0;
}

.quicktech-testimonial {
  overflow: hidden;
  padding: 15px !important; /* Space for box-shadow */
  margin: -15px !important;
}

.testi-card {
  background: #ffffff;
  border-radius: 12px;
  padding: 24px;
  display: flex;
  gap: 16px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);

  box-sizing: border-box;
  border: 1px solid #f0f2f5;
  height: 165px;
}

.testi-avatar img {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  object-fit: cover;
  background-color: #e2e8f0;
}

.testi-content {
  flex: 1;
}

.testi-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 12px;
}

.testi-user h4 {
  margin: 0 0 4px 0;
  color: #1a202c;
  font-size: 15px;
  font-weight: 600;
}

.testi-user span {
  color: #718096;
  font-size: 12px;
  display: block;
}

.testi-stars {
  color: #fbc02d;
  font-size: 14px;
  letter-spacing: 2px;
}

.testi-text {
  margin: 0;
  color: #4a5568;
  font-size: 13.5px;
  line-height: 1.6;
}

/* --- Custom Swiper Arrows --- */
.custom-nav {
  background-color: #ffffff;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50%;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
  color: #1a202c !important;
  padding: 11px;
}
.custom-nav::after {
  font-size: 14px !important;
  font-weight: 700;
}

.swiper-button-prev.custom-nav {
  left: -27px;
}

.swiper-button-next.custom-nav {
  right: -27px;
}

/* Responsive adjustments */
@media (max-width: 992px) {
  .view-all {
    position: static;
    margin-top: 15px;
  }
  .title-row {
    flex-direction: column;
  }
  .swiper-button-prev.custom-nav,
  .swiper-button-next.custom-nav {
    display: none; /* Hide arrows on smaller screens */
  }
}

/* testimonial */

/* footer */
.quicktech-footer {
  background-color: #21428a; /* The exact dark teal color from the image */
  color: #e2e8f0;
  padding-top: 60px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.quicktech-footer-logo-img {
  height: 60px;
  background: white;
  border-radius: 5px;
}
/* Display Grid applied as requested */
.quicktech-footer-container {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr 1fr 1fr 1.2fr;
  gap: 30px;
  padding-bottom: 50px;
}

/* Subtle thin vertical border lines matching the original preview */
.quicktech-footer-col:not(:last-child) {
  border-right: 1px solid rgba(255, 255, 255, 0.15);
  padding-right: 20px;
}

/* Typography styles */
.quicktech-footer-logo-area {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}

.quicktech-footer-logo-icon {
  font-size: 34px;
  color: #ffffff;
}

.quicktech-footer-logo-text h3 {
  color: #ffffff;
  font-weight: 700;
  font-size: 24px;
  margin: 0;
  line-height: 1.1;
}

.quicktech-footer-logo-text p {
  color: #a0aec0;
  font-size: 11px;
  margin: 0;
  letter-spacing: 0.5px;
}

.quicktech-footer-description {
  font-size: 13.5px;
  line-height: 1.6;
  color: #cbd5e0;
  margin-bottom: 24px;
  max-width: 90%;
}

.quicktech-footer-title {
  color: #ffffff;
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 22px;
}

.quicktech-footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
}

.quicktech-footer-links li {
  margin-bottom: 11px;
}

.quicktech-footer-links li a {
  color: #cbd5e0;
  text-decoration: none;
  font-size: 14px;
  transition: color 0.2s ease-in-out;
}

.quicktech-footer-links li a:hover {
  color: #ffffff;
}

/* Contact Info Area */
.quicktech-footer-contact-info {
  list-style: none;
  padding: 0;
  margin: 0;
}

.quicktech-footer-contact-info li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 14px;
  color: #cbd5e0;
  margin-bottom: 16px;
}

.quicktech-footer-contact-info li i {
  font-size: 16px;
  margin-top: 3px;
  color: #a0aec0;
  width: 20px;
  text-align: center;
}

.quicktech-footer-contact-info li span {
  line-height: 1.4;
}

/* Round brand-specific Social Icon shapes */
.quicktech-footer-socials {
  display: flex;
  gap: 10px;
}

.quicktech-footer-socials .social-icon {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: #ffffff;
  font-size: 14px;
  text-decoration: none;
  transition: transform 0.2s ease;
}

.quicktech-footer-socials .social-icon:hover {
  transform: translateY(-3px);
}

.quicktech-footer-socials .fb {
  background-color: #3b5998;
}
.quicktech-footer-socials .insta {
  background-color: #e1306c;
}
.quicktech-footer-socials .threads {
  background-color: #000000;
}
.quicktech-footer-socials .whatsapp {
  background-color: #25d366;
}
.quicktech-footer-socials .youtube {
  background-color: #ff0000;
}

/* Copyright bar styling */
.quicktech-footer-bottom {
  background-color: #0cb7b5; /* Darkened variant block for base bar */
  padding: 13px 0;
  font-size: 13px;
  color: white;
}

/* Responsive Grid Adapters */
@media (max-width: 1200px) {
  .quicktech-footer-container {
    grid-template-columns: 1.5fr 1fr 1fr;
    row-gap: 40px;
  }
  .quicktech-footer-col:nth-child(3) {
    border-right: none;
  }
}

@media (max-width: 768px) {
  .quicktech-footer-container {
    grid-template-columns: 1fr;
    row-gap: 30px;
  }
  .quicktech-footer-col {
    border-right: none !important;
    padding-right: 0 !important;
  }
}

/* footer */

/* appointment */
.quicktech-banner-appointment {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 500px;
}
.quicktech-appointment-set-container {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

@media (min-width: 1024px) {
  .quicktech-appointment-set-container {
    flex-direction: row;
  }
}

.quicktech-appointment-set-main-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* Stepper */
.quicktech-appointment-set-stepper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 20px;
  border-bottom: 1px solid #f0f0f0;
  overflow-x: auto;
}

.quicktech-appointment-set-step {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: max-content;
}

.quicktech-appointment-set-step-number {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: 14px;
  background-color: #fff;
  border: 1px solid #d1d5db;
  color: #6b7280;
}

.quicktech-appointment-set-step.active .quicktech-appointment-set-step-number {
  background-color: #21428a;
  color: #fff;
  border-color: #21428a;
}

.quicktech-appointment-set-step-text h4 {
  font-size: 14px;
  font-weight: 600;
  color: #111827;
}

.quicktech-appointment-set-step-text p {
  font-size: 12px;
  color: #6b7280;
  margin-bottom: 0 !important;
}

.quicktech-appointment-set-step-divider {
  height: 1px;
  background-color: #e5e7eb;
  flex: 1;
  margin: 0 16px;
  min-width: 30px;
}

/* Content Grid */
.quicktech-appointment-set-content-grid {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

@media (min-width: 768px) {
  .quicktech-appointment-set-content-grid {
    flex-direction: row;
  }
}

.quicktech-appointment-set-section-title {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 16px;
  color: #111827;
}

.quicktech-appointment-set-services,
.quicktech-appointment-set-datetime {
  flex: 1;
}

/* Services Cards */
.quicktech-appointment-set-services-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}

.quicktech-appointment-set-service-card {
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 16px;
  cursor: pointer;
  position: relative;
  transition: all 0.2s ease;
  background-color: #fff;
  display: flex;
  gap: 12px;
  align-items: flex-start;
}

.quicktech-appointment-set-service-card:hover {
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}

.quicktech-appointment-set-service-card.active {
  border-color: #21428a;
  background-color: #f8fdfc;
}

.quicktech-appointment-set-card-check {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 18px;
  height: 18px;
  background-color: #21428a;
  border-radius: 50%;
  display: none;
  align-items: center;
  justify-content: center;
}

.quicktech-appointment-set-service-card.active
  .quicktech-appointment-set-card-check {
  display: flex;
}

.quicktech-appointment-set-card-check svg {
  width: 10px;
  height: 10px;
  fill: none;
  stroke: white;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.quicktech-appointment-set-icon-box {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 24px;
  color: white;
}

.quicktech-appointment-set-service-info h5 {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 4px;
}

.quicktech-appointment-set-service-info p {
  font-size: 11px;
  color: #6b7280;
  line-height: 1.4;
  margin-bottom: 8px;
}

.quicktech-appointment-set-price {
  font-size: 13px;
  font-weight: 600;
  color: #21428a;
}

.quicktech-appointment-set-emergency-banner {
  margin-top: 16px;
  background-color: #21428a12;
  border-radius: 8px;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 13px;
  color: #21428a;
}

.quicktech-appointment-set-emergency-banner strong {
  font-size: 15px;
}

/* Calendar */
.quicktech-appointment-set-calendar-wrapper {
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 20px;
  background-color: #fff;
}

.quicktech-appointment-set-calendar-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.quicktech-appointment-set-calendar-header button {
  background: none;
  border: none;
  cursor: pointer;
  color: #4b5563;
  padding: 4px;
}

.quicktech-appointment-set-calendar-header button:hover {
  color: #111827;
}

.quicktech-appointment-set-calendar-title {
  font-weight: 600;
  font-size: 16px;
}

.quicktech-appointment-set-calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
  text-align: center;
}

.quicktech-appointment-set-weekday {
  font-size: 12px;
  color: #6b7280;
  margin-bottom: 8px;
  font-weight: 500;
}

.quicktech-appointment-set-day {
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  cursor: pointer;
  border-radius: 6px;
  color: #374151;
  transition: background 0.2s;
}

.quicktech-appointment-set-day:hover:not(.disabled) {
  background-color: #f3f4f6;
  color: black;
}

.quicktech-appointment-set-day.disabled {
  color: #d1d5db;
  cursor: not-allowed;
}

.quicktech-appointment-set-day.active {
  background-color: #21428a;
  color: #fff;
  font-weight: 600;
}

/* Time Slots */
.quicktech-appointment-set-time-slots-title {
  font-size: 14px;
  font-weight: 600;
  margin: 20px 0 12px 0;
}

.quicktech-appointment-set-time-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.quicktech-appointment-set-time-slot {
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  padding: 8px;
  text-align: center;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  color: #4b5563;
  background-color: #fff;
  transition: all 0.2s;
}

.quicktech-appointment-set-time-slot:hover {
  border-color: #21428a;
  color: #21428a;
}

.quicktech-appointment-set-time-slot.active {
  background-color: #21428a;
  color: #fff;
  border-color: #21428a;
}

/* Sidebar Summary */
.quicktech-appointment-set-sidebar {
  width: 100%;
  background-color: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  height: max-content;
}

@media (min-width: 1024px) {
  .quicktech-appointment-set-sidebar {
    width: 380px;
  }
}

.quicktech-appointment-set-sidebar-title {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 20px;
}

.quicktech-appointment-set-summary-profile {
  display: flex;
  gap: 12px;
  align-items: center;
  margin-bottom: 24px;
}

.quicktech-appointment-set-summary-profile img {
  width: 50px;
  height: 50px;
  border-radius: 6px;
  object-fit: cover;
}

.quicktech-appointment-set-summary-profile h5 {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 2px;
}

.quicktech-appointment-set-summary-profile p {
  font-size: 11px;
  color: #6b7280;
  line-height: 1.3;
}

.quicktech-appointment-set-summary-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 24px;
  border-bottom: 1px dashed #e5e7eb;
  padding-bottom: 24px;
}

.quicktech-appointment-set-summary-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
}

.quicktech-appointment-set-summary-item-label {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #6b7280;
}

.quicktech-appointment-set-summary-item-value {
  font-weight: 500;
  color: #111827;
  text-align: right;
}

.quicktech-appointment-set-charges {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
}

.quicktech-appointment-set-charges-label {
  font-size: 14px;
  font-weight: 500;
  color: #4b5563;
}

.quicktech-appointment-set-charges-value {
  font-size: 20px;
  font-weight: 700;
  color: #21428a;
}

.quicktech-appointment-set-btn-primary {
  background-color: #21428a;
  color: #fff;
  border: none;
  border-radius: 6px;
  padding: 14px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  transition: background 0.2s;
}

.quicktech-appointment-set-btn-primary:hover {
  background-color: #21428a;
}

.quicktech-appointment-set-btn-outline {
  background-color: #fff;
  color: #21428a;
  border: 1px solid #21428a;
  border-radius: 6px;
  padding: 12px;
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  transition: background 0.2s;
}

.quicktech-appointment-set-btn-outline:hover {
  background-color: #21428a12;
}

.quikctech-app-sser {
  background-color: #21428a12;
}
.quicktech-app-serv-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;

  /* border: 1px solid #eef2f1; */
  border-radius: 12px;
  padding: 24px 32px;
  width: 100%;
}

.quicktech-app-serv-item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  flex: 1;
  position: relative;
  padding: 0 24px;
}

.quicktech-app-serv-item:first-child {
  padding-left: 0;
}

.quicktech-app-serv-item:last-child {
  padding-right: 0;
}

/* Vertical Divider */
.quicktech-app-serv-item:not(:last-child)::after {
  content: "";
  position: absolute;
  right: 0;
  top: 10%;
  height: 80%;
  width: 1px;
  background-color: #e5e9e8;
}

.quicktech-app-serv-icon-box {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background-color: #21428a42;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.quicktech-app-serv-icon-box svg {
  width: 22px;
  height: 22px;
  stroke: #21428a;
  stroke-width: 1.8;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.quicktech-app-serv-text {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
}

.quicktech-app-serv-title {
  color: #21428a;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
}

.quicktech-app-serv-desc {
  color: #6b7280;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
}

/* Responsive Design */
@media (max-width: 1024px) {
  .quicktech-app-serv-wrapper {
    flex-wrap: wrap;
    gap: 24px 0;
    padding: 24px;
  }
  .quicktech-app-serv-item {
    flex: 1 1 calc(33.333% - 20px);
    padding: 0 12px;
  }
  .quicktech-app-serv-item:nth-child(3)::after {
    display: none; /* Hide divider on row wrap */
  }
}

@media (max-width: 768px) {
  .quicktech-app-serv-wrapper {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }
  .quicktech-app-serv-item {
    flex: 1 1 100%;
    width: 100%;
    padding: 0;
  }
  .quicktech-app-serv-item::after {
    display: none; /* Hide all dividers on mobile */
  }
}

/* appointment */

.quicktech-blood-banner-wrapper {
  max-width: 100%;
  margin: 0 auto;
  border-radius: 12px;
  padding: 60px 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
}

/* HTML Image used as background */
.quicktech-blood-banner-bg-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}

/* White gradient overlay to ensure text readability */
.quicktech-blood-banner-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.95) 0%,
    rgba(255, 255, 255, 0.85) 35%,
    rgba(255, 255, 255, 0.2) 50%,
    rgba(255, 255, 255, 0.3) 100%
  );
  z-index: 1;
}

.quicktech-blood-banner-left,
.quicktech-blood-banner-right {
  position: relative;
  z-index: 2;
}

/* Left Column Content */
.quicktech-blood-banner-left {
  max-width: 500px;
}

.quicktech-blood-banner-heading {
  font-size: 40px;
  font-weight: 800;
  color: #111827;
  line-height: 1.2;
  margin-bottom: 4px;
}

.quicktech-blood-banner-subheading {
  font-size: 38px;
  font-weight: 800;
  color: #ce1a22; /* Red accent */
  line-height: 1.2;
  margin-bottom: 20px;
}

.quicktech-blood-banner-text {
  font-size: 15px;
  color: #4b5563;
  line-height: 1.6;
  margin-bottom: 30px;
  max-width: 420px;
}

/* Features Grid */
.quicktech-blood-banner-features {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-bottom: 36px;
}

.quicktech-blood-banner-feature {
  display: flex;
  align-items: center;
  gap: 12px;
}

.quicktech-blood-banner-feature-icon {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color: #fff;
  border: 1px solid #fee2e2;
  box-shadow: 0 2px 10px rgba(206, 26, 34, 0.05);
}

.quicktech-blood-banner-feature-icon svg {
  width: 18px;
  height: 18px;
  stroke: #ce1a22;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.quicktech-blood-banner-feature-text {
  display: flex;
  flex-direction: column;
}

.quicktech-blood-banner-feature-title {
  font-size: 13px;
  font-weight: 700;
  color: #111827;
}

.quicktech-blood-banner-feature-sub {
  font-size: 12px;
  color: #6b7280;
}

/* Buttons */
.quicktech-blood-banner-buttons {
  display: flex;
  align-items: center;
  gap: 16px;
}

.quicktech-blood-banner-btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background-color: #ce1a22;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  padding: 14px 24px;
  border-radius: 8px;
  text-decoration: none;
  border: 1px solid #ce1a22;
  transition: all 0.3s ease;
}

.quicktech-blood-banner-btn-primary svg {
  width: 16px;
  height: 16px;
  fill: currentColor;
}

.quicktech-blood-banner-btn-primary:hover {
  background-color: #a81217;
  border-color: #a81217;
  color: white;
}

.quicktech-blood-banner-btn-outline {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background-color: #fff;
  color: #111827;
  font-size: 14px;
  font-weight: 600;
  padding: 14px 24px;
  border-radius: 8px;
  text-decoration: none;
  border: 1px solid #fca5a5;
  transition: all 0.3s ease;
}

.quicktech-blood-banner-btn-outline svg {
  width: 18px;
  height: 18px;
  stroke: #ce1a22;
  fill: none;
  stroke-width: 2;
}

.quicktech-blood-banner-btn-outline:hover {
  background-color: #a81217;
  color: white;
}

/* Right Column - Emergency Card */
.quicktech-blood-banner-right {
  width: 100%;
  max-width: 440px;
}

.quicktech-blood-banner-card {
  background-color: #fff;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
}

.quicktech-blood-banner-card-top {
  padding: 32px;
  position: relative;
}

.quicktech-blood-banner-badge {
  display: inline-block;
  background-color: rgba(255, 255, 255, 0.2);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 6px 12px;
  border-radius: 20px;
  margin-bottom: 16px;
}

.quicktech-blood-banner-card-title {
  color: #fff;
  font-size: 26px;
  font-weight: 700;
  margin-bottom: 8px;
}

.quicktech-blood-banner-card-desc {
  color: rgba(255, 255, 255, 0.9);
  font-size: 14px;
  margin-bottom: 24px;
}

.quicktech-blood-banner-card-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background-color: #fff;
  color: #ce1a22;
  font-size: 14px;
  font-weight: 700;
  padding: 12px 20px;
  border-radius: 6px;
  text-decoration: none;
  transition: background 0.3s ease;
}

.quicktech-blood-banner-card-btn svg {
  width: 16px;
  height: 16px;
  stroke: currentColor;
  stroke-width: 2;
  fill: none;
}

.quicktech-blood-banner-card-btn:hover {
  background-color: #f8f9fa;
}

.quicktech-blood-banner-siren {
  position: absolute;
  right: 20px;
  bottom: 20px;
  width: 100px;
  height: 100px;
  object-fit: contain;
  content: url("https://cdn3d.iconscout.com/3d/premium/thumb/siren-4993322-4161833.png");
  filter: drop-shadow(0 10px 15px rgba(0, 0, 0, 0.3));
}

/* Stats Area */
.quicktech-blood-banner-card-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 24px 32px;
  background-color: #fff;
}

.quicktech-blood-banner-stat {
  text-align: center;
  flex: 1;
}

.quicktech-blood-banner-stat-num {
  color: #ce1a22;
  font-size: 24px;
  font-weight: 800;
  margin-bottom: 4px;
}

.quicktech-blood-banner-stat-label {
  font-size: 11px;
  color: #6b7280;
  font-weight: 500;
}

.quicktech-blood-banner-stat-divider {
  width: 1px;
  height: 40px;
  background-color: #e5e7eb;
}

/* Responsive */
@media (max-width: 1024px) {
  .quicktech-blood-banner-wrapper {
    flex-direction: column;
    padding: 40px 30px;
  }
  .quicktech-blood-banner-overlay {
    background: linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.95) 0%,
      rgba(255, 255, 255, 0.85) 40%,
      rgba(255, 255, 255, 0.3) 100%
    );
  }
  .quicktech-blood-banner-left {
    max-width: 100%;
    text-align: center;
  }
  .quicktech-blood-banner-text {
    margin: 0 auto 30px auto;
  }
  .quicktech-blood-banner-features,
  .quicktech-blood-banner-buttons {
    justify-content: center;
    flex-wrap: wrap;
  }
  .quicktech-blood-banner-right {
    max-width: 100%;
  }
}

@media (max-width: 600px) {
  .quicktech-blood-banner-heading,
  .quicktech-blood-banner-subheading {
    font-size: 32px;
  }
  .quicktech-blood-banner-features {
    flex-direction: column;
    align-items: flex-start;
    padding-left: 20px;
  }
  .quicktech-blood-banner-buttons {
    flex-direction: column;
    width: 100%;
  }
  .quicktech-blood-banner-btn-primary,
  .quicktech-blood-banner-btn-outline {
    width: 100%;
    justify-content: center;
  }
  .quicktech-blood-banner-card-bottom {
    padding: 20px;
  }
  .quicktech-blood-banner-siren {
    width: 70px;
    height: 70px;
    bottom: auto;
    top: 20px;
  }
}

/* blood donation */

.quicktech-donation-request-grid {
  display: grid;
  grid-template-columns: 300px 1fr 340px;
  gap: 24px;
}

/* Shared Card Styles */
.quicktech-donation-request-card {
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e5e7eb;
  padding: 20px;
  margin-bottom: 24px;
}

.quicktech-donation-request-card:last-child {
  margin-bottom: 0;
}

.quicktech-donation-request-title-main {
  font-size: 16px;
  font-weight: 700;
  color: #111827;
  margin-bottom: 6px;
}

.quicktech-donation-request-subtitle {
  font-size: 12px;
  color: #6b7280;
  margin-bottom: 16px;
}

/* Left Column: Search */
.quicktech-donation-request-search-input-group {
  display: flex;
  align-items: center;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 12px 16px;
  margin-bottom: 12px;
  cursor: pointer;
  position: relative;
}

.quicktech-donation-request-search-icon {
  width: 18px;
  height: 18px;
  margin-right: 12px;
  stroke: #d32f2f;
  fill: none;
  stroke-width: 2;
}

.quicktech-donation-request-search-icon-green {
  stroke: #21428a;
}

.quicktech-donation-request-search-text {
  display: flex;
  flex-direction: column;
  flex: 1;
}

.quicktech-donation-request-search-label {
  font-size: 10px;
  color: #6b7280;
  font-weight: 500;
}

.quicktech-donation-request-search-val {
  font-size: 14px;
  color: #111827;
  font-weight: 600;
}

.quicktech-donation-request-chevron-down {
  width: 16px;
  height: 16px;
  stroke: #9ca3af;
  fill: none;
  stroke-width: 2;
}

.quicktech-donation-request-btn-search {
  width: 100%;
  background-color: #21428a;
  color: #ffffff;
  border: none;
  border-radius: 8px;
  padding: 14px;
  font-size: 14px;
  font-weight: 600;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  transition: 0.3s;
}

.quicktech-donation-request-btn-search svg {
  width: 16px;
  height: 16px;
  stroke: #ffffff;
  fill: none;
  stroke-width: 2;
}

/* Left Column: Emergency */
.quicktech-donation-request-emergency {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.quicktech-donation-request-emergency-header {
  display: flex;
  align-items: center;
  gap: 16px;
}

.quicktech-donation-request-emergency-icon {
  width: 50px;
  height: 50px;
  background-color: #fef2f2;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.quicktech-donation-request-emergency-icon svg {
  width: 24px;
  height: 24px;
  stroke: #d32f2f;
  fill: none;
  stroke-width: 2;
}

.quicktech-donation-request-emergency-title {
  color: #d32f2f;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2;
}

.quicktech-donation-request-emergency-text {
  font-size: 12px;
  color: #4b5563;
  line-height: 1.5;
}

.quicktech-donation-request-btn-red {
  background-color: #d32f2f;
  color: #ffffff;
  border: 1px solid #d32f2f;
  border-radius: 6px;
  padding: 10px 16px;
  font-size: 12px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  width: fit-content;
  transition: 0.3s ease;
}

.quicktech-donation-request-btn-red:hover {
  background-color: white;
  border: 1px solid #d32f2f;
  color: #d32f2f;
}

.quicktech-donation-request-btn-red svg {
  width: 14px;
  height: 14px;
  stroke: #ffffff;
  fill: none;
  stroke-width: 2;
}

/* Middle Column: Header */
.quicktech-donation-request-mid-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.quicktech-donation-request-mid-title {
  font-size: 16px;
  font-weight: 700;
  color: #111827;
}

.quicktech-donation-request-link-view-all {
  font-size: 13px;
  font-weight: 600;
  color: #21428a;
  text-decoration: none;
}

/* Middle Column: Donor Cards Grid */
.quicktech-donation-request-donor-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 24px;
}

.quicktech-donation-request-donor-card {
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e5e7eb;
  padding: 20px 6px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}

.quicktech-donation-request-donor-avatar-wrap {
  position: relative;
  margin-bottom: 12px;
}

.quicktech-donation-request-donor-avatar {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #f3f4f6;
}

.quicktech-donation-request-status-badge {
  position: absolute;
  top: 0;
  right: -20px;
  font-size: 10px;
  font-weight: 700;
  color: #ffffff;
  padding: 2px 8px;
  border-radius: 12px;
}

.quicktech-donation-request-status-online {
  background-color: #10b981;
}

.quicktech-donation-request-status-busy {
  background-color: #f59e0b;
}

.quicktech-donation-request-donor-name-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 8px;
}

.quicktech-donation-request-donor-name {
  font-size: 13px;
  font-weight: 700;
  color: #111827;
}

.quicktech-donation-request-blood-badge {
  background-color: #d32f2f;
  color: #ffffff;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 4px;
}

.quicktech-donation-request-donor-info {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: #6b7280;
  margin-bottom: 4px;
  width: 100%;
  justify-content: center;
}

.quicktech-donation-request-donor-info svg {
  width: 12px;
  height: 12px;
  stroke: #d32f2f;
  fill: none;
  stroke-width: 2;
}

.quicktech-donation-request-btn-request-outline {
  width: 100%;
  margin-top: 12px;
  background-color: #ffffff;
  color: #21428a;
  border: 1px solid #21428a;
  border-radius: 6px;
  padding: 8px;
  font-size: 13px;
  font-weight: 600;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  transition: 0.3s ease;
}

.quicktech-donation-request-btn-request-outline svg {
  width: 14px;
  height: 14px;
  fill: #21428a;
}

/* Middle Column: Bottom Action Cards */
.quicktech-donation-request-action-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.quicktech-donation-request-action-card {
  background: #21428a12; /* Light teal tint */
  border-radius: 12px;
  padding: 20px;
  display: flex;
  align-items: center;
  gap: 16px;
  border: 1px solid #eef2f1;
}

.quicktech-donation-request-action-card-white {
  background: #ffffff;
}

.quicktech-donation-request-action-img {
  width: 60px;
  height: auto;
  flex-shrink: 0;
}

.quicktech-donation-request-action-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

.quicktech-donation-request-action-title {
  font-size: 14px;
  font-weight: 700;
  color: #21428a;
  line-height: 1.2;
}

.quicktech-donation-request-action-desc {
  font-size: 11px;
  color: #4b5563;
  line-height: 1.4;
}

.quicktech-donation-request-btn-green-solid {
  background-color: #21428a;
  color: #ffffff;
  border: none;
  border-radius: 6px;
  padding: 8px 16px;
  font-size: 12px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  border: 1px solid #21428a;
  transition: 0.3s ease;
}

.quicktech-donation-request-btn-green-solid:hover {
  background-color: white;
  color: #21428a;
  border: 1px solid #21428a;
}

.quicktech-donation-request-btn-green-solid svg {
  width: 14px;
  height: 14px;
  stroke: #ffffff;
  fill: none;
  stroke-width: 2;
}

.quicktech-donation-request-btn-green-outline {
  background-color: #ffffff;
  color: #21428a;
  border: 1px solid #21428a;
  border-radius: 6px;
  padding: 8px 16px;
  font-size: 12px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  transition: 0.3s ease;
}

.quicktech-donation-request-btn-green-outline:hover {
  background-color: #21428a;
  color: white;
  border: 1px solid #21428a;
}
/* Right Column: Blood Group Availability */
.quicktech-donation-request-avail-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 20px;
}

.quicktech-donation-request-avail-header svg {
  width: 18px;
  height: 18px;
  stroke: #d32f2f;
  fill: none;
  stroke-width: 2;
}

.quicktech-donation-request-avail-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 20px;
}

.quicktech-donation-request-avail-item {
  display: flex;
  align-items: center;
  gap: 12px;
}

.quicktech-donation-request-avail-blood {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 50px;
  font-size: 13px;
  font-weight: 700;
  color: #111827;
}

.quicktech-donation-request-avail-blood svg {
  width: 12px;
  height: 12px;
  fill: #d32f2f;
}

.quicktech-donation-request-avail-bar-wrap {
  flex: 1;
  height: 6px;
  background-color: #f3f4f6;
  border-radius: 4px;
  overflow: hidden;
}

.quicktech-donation-request-avail-bar {
  height: 100%;
  background-color: #d32f2f;
  border-radius: 4px;
}

.quicktech-donation-request-avail-count {
  width: 60px;
  text-align: right;
  font-size: 12px;
  color: #4b5563;
  font-weight: 500;
}

.quicktech-donation-request-btn-view-groups {
  width: 100%;
  background-color: #ffffff;
  color: #21428a;
  border: 1px solid #21428a;
  border-radius: 6px;
  padding: 10px;
  font-size: 13px;
  font-weight: 600;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  transition: 0.3s ease;
}

.quicktech-donation-request-btn-view-groups:hover {
  background-color: #21428a;
  color: white;
}

.quicktech-donation-request-btn-view-groups svg {
  width: 16px;
  height: 16px;
  stroke: #21428a;
  fill: none;
  stroke-width: 2;
}

/* Right Column: Smile Card */
.quicktech-donation-request-smile-card {
  background-color: #21428a;
  border-radius: 12px;
  padding: 24px;
  color: #ffffff;
  display: flex;
  align-items: center;
  gap: 16px;
}

.quicktech-donation-request-smile-icon {
  width: 50px;
  height: 50px;
  flex-shrink: 0;
}

.quicktech-donation-request-smile-content h4 {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 6px;
}

.quicktech-donation-request-smile-content p {
  font-size: 12px;
  color: #a7f3d0; /* Light green tint */
  line-height: 1.4;
}

/* Responsive */
@media (max-width: 1200px) {
  .quicktech-donation-request-grid {
    grid-template-columns: 280px 1fr;
  }
  .quicktech-donation-request-donor-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .quicktech-donation-request-smile-card,
  .quicktech-donation-request-availability-card {
    grid-column: 1 / -1;
  }
}

@media (max-width: 768px) {
  .quicktech-donation-request-grid {
    grid-template-columns: 1fr;
  }
  .quicktech-donation-request-action-grid {
    grid-template-columns: 1fr;
  }
  .quicktech-donation-request-donor-grid {
    grid-template-columns: 1fr 1fr;
  }
}
/* Hover Effect for Search Button */
.quicktech-donation-request-btn-search {
  transition: all 0.3s ease;
  border: 2px solid transparent;
}

.quicktech-donation-request-btn-search:hover {
  background-color: #ffffff !important;
  color: #21428a !important;
  border-color: #21428a !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

/* Icon Color Fixes */
.quicktech-donation-request-search-icon {
  color: #d32f2f;
}
.quicktech-donation-request-search-icon-green {
  color: #21428a !important;
}
/* blood donation */

.quicktech-donation-request-btn-request-outline:hover {
  background-color: #21428a;
  color: white;
}

.quicktech-blood-d-w {
  background-color: #21428a;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

/* Typography & Layout */
.quicktech-blood-d-w .text-white {
  color: #ffffff;
}

.quicktech-blood-d-w .opacity-8 {
  opacity: 0.8;
}

.quicktech-blood-d-w .fw-bold {
  font-weight: 700;
}

/* Border Separator */
.quicktech-blood-d-w .border-divider {
  border-right: 1px solid #4a6a65;
}

/* Icon Styling */
.quicktech-blood-d-w .icon-heart {
  color: #dc3545;
}

.quicktech-blood-d-w .icon-whatsapp {
  color: #198754;
}

/* Hover Effect for WhatsApp */
.quicktech-blood-d-w .whatsapp-link {
  text-decoration: none;
  transition: opacity 0.3s ease;
}

.quicktech-blood-d-w .whatsapp-link:hover {
  opacity: 0.9;
  cursor: pointer;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .quicktech-blood-d-w .border-divider {
    border-right: none;
    border-bottom: 1px solid #4a6a65;
    padding-bottom: 10px;
    margin-bottom: 10px;
  }
}

/* nursing service */
.quicktech-nursing-ser-header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-bottom: 15px;
}

.quicktech-nursing-ser-title {
  font-size: 24px;
  font-weight: 700;
  color: #031a24;
  margin: 0;
  text-align: center;
}
.gapp{
  row-gap: 20px;
}
.quicktech-nursing-ser-line {
  display: inline-block;
  width: 40px;
  height: 2px;
  background-color: #007a78;
}

/* Response Container Responsive Grid Layout */
.quicktech-nursing-ser-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 16px;
}

@media (max-width: 1100px) {
  .quicktech-nursing-ser-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  .quicktech-nursing-ser-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 480px) {
  .quicktech-nursing-ser-grid {
    grid-template-columns: 1fr 1fr;
  }
}

/* Card Elements */
.quicktech-nursing-ser-card {
  background: #ffffff;
  border: 1px solid #f0f3f5;
  border-radius: 12px;
  padding: 24px 16px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.01);
}

.quicktech-nursing-ser-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 20px rgba(0, 122, 120, 0.06);
  border-color: rgba(0, 122, 120, 0.15);
}

/* Circular Icon Container & Icons */
.quicktech-nursing-ser-icon-wrapper {
  width: 64px;
  height: 64px;
  background-color: #21428a12;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}

.quicktech-nursing-ser-icon {
  width: 28px;
  height: 28px;
  color: #006664;
}

/* Card Typography */
.quicktech-nursing-ser-card-title {
  font-size: 15px;
  font-weight: 700;
  color: #0d1e25;
  line-height: 1.3;
  margin: 0 0 8px 0;
  min-height: 40px; /* Aligns text cleanly if titles break lines */
  display: flex;
  align-items: center;
  justify-content: center;
}

.quicktech-nursing-ser-card-desc {
  font-size: 13px;
  font-weight: 400;
  color: #718096;
  line-height: 1.4;
  margin: 0;
}

.quicktech-ser-content-why-box {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 32px;
}

.quicktech-ser-content-main-title {
  font-size: 24px;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.3;
}

.quicktech-ser-content-img-wrapper {
  border-radius: 12px;
  overflow: hidden;
  height: 180px;
}

.quicktech-ser-content-thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.quicktech-ser-content-feature-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.quicktech-ser-content-feature-list li {
  font-size: 14px;
  font-weight: 500;
  color: #334155;
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  gap: 12px;
}

.quicktech-ser-content-feature-list li i {
  color: #21428a;
  font-size: 18px;
}

/* SECTION 2: Nurse Cards Styles */
.quicktech-ser-content-section-title {
  font-size: 18px;
  font-weight: 700;
  color: #0f172a;
}

.quicktech-ser-content-view-all {
  font-size: 13px;
  font-weight: 600;
  color: #21428a;
}

.quicktech-ser-content-nurse-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 20px;
}

.quicktech-ser-content-avatar {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  object-fit: cover;
}

.quicktech-ser-content-nurse-name {
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
  margin: 0;
}

.quicktech-ser-content-nurse-designation {
  font-size: 12px;
  color: #64748b;
}

.quicktech-ser-content-nurse-details {
  list-style: none;
  padding: 0;
  margin: 15px 0;
}

.quicktech-ser-content-nurse-details li {
  font-size: 12px;
  color: #475569;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.quicktech-ser-content-nurse-details li i {
  color: #21428a;
  width: 14px;
}

.quicktech-ser-content-rating i {
  color: #f59e0b;
  font-size: 12px;
}

.quicktech-ser-content-rating span {
  font-size: 12px;
  color: #0f172a;
}

.quicktech-ser-content-btn-primary {
  background-color: #21428a;
  color: #ffffff;
  font-size: 13px;
  font-weight: 600;
  padding: 8px;
  border-radius: 6px;
  border: none;
}

.quicktech-ser-content-btn-primary:hover {
  background-color: #21428a;
  color: #ffffff;
}

/* RIGHT SIDEBAR: Booking Form Styles */
.quicktech-ser-content-form-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
}

.quicktech-ser-content-form-header {
  background-color: #21428a;
  padding: 20px;
  color: #ffffff;
}

.quicktech-ser-content-form-header h3 {
  font-size: 18px;
  font-weight: 600;
  margin: 0 0 4px 0;
}

.quicktech-ser-content-form-header p {
  font-size: 12px;
  opacity: 0.85;
  margin: 0;
}

.quicktech-ser-content-form-body {
  padding: 24px 20px;
}

.quicktech-ser-content-label {
  font-size: 12px;
  font-weight: 600;
  color: #475569;
  margin-bottom: 6px;
}

.quicktech-ser-content-input {
  font-size: 13px;
  padding: 10px 12px;
  border-color: #cbd5e1;
  border-radius: 6px;
  color: #334155;
}

.quicktech-ser-content-input-icon {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #64748b;
  font-size: 14px;
  pointer-events: none;
}

.quicktech-ser-content-btn-submit {
  background-color: #21428a;
  color: #ffffff;
  font-size: 14px;
  font-weight: 600;
  padding: 12px;
  border-radius: 6px;
  border: none;
}

.quicktech-ser-content-btn-submit:hover {
  background-color: #21428a;
  color: #ffffff;
}

.quicktech-ser-content-mini-badge {
  background-color: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 10px 4px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
}

.quicktech-ser-content-mini-badge i {
  color: #21428a;
  font-size: 16px;
}

.quicktech-ser-content-mini-badge span {
  font-size: 10px;
  font-weight: 600;
  color: #475569;
  line-height: 1.2;
}

/* FOOTER FEATURE BAR Styles */
.quicktech-ser-content-footer-bar {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 24px;
}

.quicktech-ser-content-footer-icon {
  font-size: 24px;
}

.quicktech-ser-content-footer-item h5 {
  font-size: 13px;
  font-weight: 700;
  color: #21428a;
  margin: 0 0 4px 0;
}

.quicktech-ser-content-footer-item p {
  font-size: 11px;
  color: #64748b;
  margin: 0;
  line-height: 1.4;
}
/* nursing service */

.quikctech-nurse-ser-contact-banner {
  background-color: #21428a; /* Exact dark teal banner background */
  border-radius: 16px;
  padding: 24px 40px;
  max-width: 100%;
  margin: 20px auto;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
}

.quikctech-nurse-ser-contact-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
}

/* Left side alignment */
.quikctech-nurse-ser-contact-info-block {
  display: flex;
  align-items: center;
  gap: 20px;
}

.quikctech-nurse-ser-contact-img-box {
  width: 221px;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.quikctech-nurse-ser-contact-thumb {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.quikctech-nurse-ser-contact-text-box {
  color: #ffffff;
}

.quikctech-nurse-ser-contact-heading {
  font-size: 24px;
  font-weight: 700;
  margin: 0 0 6px 0;
  letter-spacing: -0.3px;
}

.quikctech-nurse-ser-contact-subtext {
  font-size: 14px;
  font-weight: 400;
  opacity: 0.9;
  margin: 0;
}

/* Right side configuration */
.quikctech-nurse-ser-contact-action-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 280px;
}

/* Call Button Design */
.quikctech-nurse-ser-contact-btn-call {
  background-color: #ffffff;
  color: #0d1e25;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 28px;
  border-radius: 30px;
  font-size: 15px;
  font-weight: 700;
  width: 100%;
  box-sizing: border-box;
  transition:
    background-color 0.2s ease,
    transform 0.2s ease;
}

.quikctech-nurse-ser-contact-btn-call:hover {
  background-color: #f3f4f6;
  transform: translateY(-1px);
  color: black;
}

.quikctech-nurse-ser-contact-icon {
  width: 16px;
  height: 16px;
  color: #21428a;
}

/* Text Divider Design */
.quikctech-nurse-ser-contact-divider {
  width: 100%;
  text-align: center;
  position: relative;
  margin: 10px 0;
}

.quikctech-nurse-ser-contact-divider::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.15);
  z-index: 1;
}

.quikctech-nurse-ser-contact-divider-text {
  background-color: #21428a;
  padding: 0 12px;
  font-size: 12px;
  color: rgba(255, 255, 255, 0.8);
  position: relative;
  z-index: 2;
  text-transform: lowercase;
}

/* WhatsApp Outline Button Design */
.quikctech-nurse-ser-contact-btn-wa {
  background-color: transparent;
  color: #ffffff;
  border: 1.5px solid rgba(255, 255, 255, 0.6);
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 11px 28px;
  border-radius: 30px;
  font-size: 15px;
  font-weight: 600;
  width: 100%;
  box-sizing: border-box;
  transition: all 0.2s ease;
}

.quikctech-nurse-ser-contact-btn-wa:hover {
  border-color: #ffffff;
  background-color: rgba(255, 255, 255, 0.05);
  transform: translateY(-1px);
  color: white;
}

.quikctech-nurse-ser-contact-icon-wa {
  width: 16px;
  height: 16px;
  fill: #ffffff;
}

/* Responsive breakpoint queries */
@media (max-width: 991px) {
  .quikctech-nurse-ser-contact-container {
    flex-direction: column;
    text-align: center;
    gap: 24px;
  }
  .quikctech-nurse-ser-contact-info-block {
    flex-direction: column;
    gap: 12px;
  }
}

/* product */
.quicktech-product-sidebar-wrapper {
  width: 100%;
  max-width: 100%;
  background: #ffffff;
  border-radius: 16px;
  padding: 24px 20px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
}

/* Header Styling */
.quicktech-product-sidebar-header {
  margin-bottom: 24px;
  padding: 0 5px;
}
.quicktech-product-sidebar-title {
  font-size: 1.15rem;
  font-weight: 700;
  color: #1a202c;
  margin: 0;
}
.quicktech-product-sidebar-menu-icon {
  font-size: 1.2rem;
  color: #4a5568;
  cursor: pointer;
  transition: color 0.2s;
}
.quicktech-product-sidebar-menu-icon:hover {
  color: #0d5c54;
}

/* List & Accordion Link Styling */
.quicktech-product-sidebar-list {
  padding-left: 0;
  margin-bottom: 0;
}
.quicktech-product-sidebar-item {
  list-style: none;
  margin-bottom: 4px;
}
.quicktech-product-sidebar-link {
  padding: 12px 16px;
  text-decoration: none;
  color: #4a5568;
  font-size: 0.95rem;
  font-weight: 500;
  border-radius: 8px;
  transition: all 0.2s ease-in-out;
  cursor: pointer;
}
.quicktech-product-sidebar-link i {
  width: 24px;
  font-size: 1.1rem;
  margin-right: 12px;
  color: #21428a;
  text-align: center;
}

/* Active & Hover States */
.quicktech-product-sidebar-link:hover,
.quicktech-product-sidebar-link.active {
  background-color: #21428a12;
  color: #21428a;
  font-weight: 600;
}
.quicktech-product-sidebar-link.active i {
  color: #21428a;
}

/* Inner Dropdown Content Styling (Accordion body) */
.quicktech-product-sidebar-dropdown-content {
  padding: 10px 15px 10px 50px;
  font-size: 0.85rem;
  color: #718096;
}

/* Bottom Banner Styling */
.quicktech-product-sidebar-banner {
  background-color: #21428a;
  border-radius: 12px;
  padding: 24px 20px 20px 20px;
  margin-top: 30px;
  position: relative;
  overflow: hidden;
  color: #ffffff;
  min-height: 190px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.quicktech-product-sidebar-banner-content {
  position: relative;
  z-index: 2;
  width: 70%;
}
.quicktech-product-sidebar-banner-title {
  font-size: 1.1rem;
  font-weight: 700;
  margin-bottom: 6px;
}
.quicktech-product-sidebar-banner-text {
  font-size: 0.8rem;
  line-height: 1.4;
  margin-bottom: 16px;
  color: #c9e4df;
}
.quicktech-product-sidebar-btn {
  background-color: #ffffff;
  color: #0d5c54;
  border: none;
  border-radius: 8px;
  padding: 8px 14px;
  font-size: 0.8rem;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  transition: all 0.3s ease;
}
.quicktech-product-sidebar-btn i {
  color: #25d366;
  margin-right: 8px;
  font-size: 1.1rem;
}
.quicktech-product-sidebar-btn:hover {
  background-color: #f1f5f4;
  color: #0d5c54;
}

/* Banner Image Alignment */
.quicktech-product-sidebar-banner-img {
  position: absolute;
  bottom: 0;
  right: -10px;
  width: 125px;
  z-index: 1;
  pointer-events: none;
}

.quicktech-pro-or-title {
  font-size: 31px;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 12px;
  letter-spacing: 1.5px;
}
.quicktech-pro-or-subtitle {
  font-size: 16px;
  color: #64748b;
  margin-bottom: 35px;
  font-weight: 400;
}

/* Search Box Wrapper */
.quicktech-pro-or-search-wrapper {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  display: flex;
  align-items: center;
  padding: 6px; /* Padding creates the inner gap for the button */
  max-width: 620px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02);
  position: relative;
}

/* Search Icon */
.quicktech-pro-or-search-icon {
  color: #94a3b8;
  font-size: 1.1rem;
  padding: 0 16px;
}

/* Search Input */
.quicktech-pro-or-input {
  flex: 1;
  border: none;
  outline: none;
  font-size: 1rem;
  color: #334155;
  background: transparent;
  padding: 12px 0;
  font-size: 13px;
}

.quicktech-pro-or-input::placeholder {
  color: #94a3b8;
}

/* Search Button */
.quicktech-pro-or-btn {
  background-color: #21428a;
  color: #ffffff;
  border: none;
  border-radius: 8px;
  padding: 16px 25px;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.2s ease;
  position: absolute;
  right: 0px;
  top: 1px;
}

.quicktech-pro-or-btn:hover {
  background-color: #21428a;
}

/* Image Wrapper */
.quicktech-pro-or-image-wrapper {
  text-align: right;
  position: relative;
}

.quicktech-pro-or-image {
  /* max-width: 100%; */
  height: auto;
  height: 214px;
}

/* Responsive Adjustments for Mobile */
@media (max-width: 991px) {
  .quicktech-pro-or-title {
    font-size: 2.5rem;
  }
  .quicktech-pro-or-image-wrapper {
    text-align: center;
    margin-top: 40px;
  }
  .quicktech-pro-or-search-wrapper {
    max-width: 100%;
  }
}

@media (max-width: 576px) {
  .quicktech-pro-or-title {
    font-size: 24px;
  }
  .quicktech-pro-or-btn {
    padding: 12px 20px;
  }
}

.quicktech-uploadpres-file-input {
  display: none;
}

/* Main Content Area */
.quicktech-uploadpres-main {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 24px 30px;
  gap: 20px;
}

/* Left Section (Icon + Text) */
.quicktech-uploadpres-left {
  display: flex;
  align-items: center;
  gap: 20px;
}

/* Custom Document Upload Icon Styling */
.quicktech-uploadpres-icon-box {
  width: 72px;
  height: 72px;
  background-color: #21428a12;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  position: relative;
}

.quicktech-uploadpres-icon-doc {
  font-size: 32px;
  color: #21428a;
}

.quicktech-uploadpres-icon-cloud {
  position: absolute;
  bottom: 12px;
  right: 10px;
  font-size: 20px;
  color: #21428a;
  background-color: #21428a12; /* Creates a cutout effect */
  border-radius: 50%;
  padding: 2px;
}

/* Text Content */
.quicktech-uploadpres-text-wrap {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.quicktech-uploadpres-title {
  font-size: 1.15rem;
  font-weight: 700;
  color: #1e293b;
  margin: 0;
}

.quicktech-uploadpres-desc {
  font-size: 0.9rem;
  color: #64748b;
  margin: 0;
  line-height: 1.4;
}

.quicktech-uploadpres-formats {
  font-size: 0.8rem;
  color: #94a3b8;
  margin: 0;
  margin-top: 4px;
}

/* Right Section (Button + Text) */
.quicktech-uploadpres-right {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
  gap: 10px;
}

/* Upload Button (Label acting as a button) */
.quicktech-uploadpres-btn {
  background-color: #21428a; /* Theme Dark Green */
  color: #ffffff;
  font-size: 0.95rem;
  font-weight: 500;
  padding: 12px 24px;
  border-radius: 8px;
  cursor: pointer;
  transition:
    background-color 0.2s ease,
    transform 0.1s ease;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0;
}

.quicktech-uploadpres-btn i {
  font-size: 1.1rem;
}

.quicktech-uploadpres-btn:hover {
  background-color: #21428a;
}

.quicktech-uploadpres-btn:active {
  transform: scale(0.98);
}

.quicktech-uploadpres-drag-text {
  font-size: 0.8rem;
  color: #64748b;
  margin: 0;
}

/* Footer / Security Message */
.quicktech-uploadpres-footer {
  border-top: 1px dashed #21428a;
  padding: 12px 30px;
  display: flex;
  align-items: center;
  gap: 10px;
  background-color: #fbfdfc;
}

.quicktech-uploadpres-footer i {
  color: #21428a;
  font-size: 1rem;
}

.quicktech-uploadpres-footer span {
  font-size: 0.85rem;
  color: #475569;
  font-weight: 500;
}

/* Responsive Design */
@media (max-width: 768px) {
  .quicktech-uploadpres-main {
    flex-direction: column;
    align-items: flex-start;
  }
  .quicktech-uploadpres-right {
    width: 100%;
    align-items: stretch;
    margin-top: 10px;
  }
  .quicktech-uploadpres-btn {
    justify-content: center;
  }
  .quicktech-uploadpres-drag-text {
    text-align: center;
  }
}

@media (max-width: 480px) {
  .quicktech-uploadpres-left {
    flex-direction: column;
    text-align: center;
    align-items: center;
  }
}
.quicktech-uploadpres-container {
  width: 100%;
  background-color: #fbfdfc; /* Very subtle green/grey tint */
  border: 1px dashed #21428a;
  border-radius: 12px;

  margin: 0 auto;
  overflow: hidden;
  margin-top: 30px;
}

.quicktech-products-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
}
.quicktech-products-title {
  font-size: 1.4rem;
  font-weight: 700;
  color: #1e293b;
  margin: 0;
}
.quicktech-products-view-all {
  color: #21428a;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.95rem;
  transition: color 0.2s ease;
}
.quicktech-products-view-all:hover {
  color: #095747;
  text-decoration: underline;
}

/* Custom CSS Grid Layout */
.quicktech-products-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 13px;
}

@media (max-width: 1200px) {
  .quicktech-products-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media (max-width: 992px) {
  .quicktech-products-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 768px) {
  .quicktech-products-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 576px) {
  .quicktech-products-grid {
    grid-template-columns: 1fr 1fr;
  }
}

/* Product Card */
.quicktech-products-card {
  background: #ffffff;
  border: 1px solid #eef2f6;
  border-radius: 12px;
  padding: 16px;
  height: 100%;
  display: flex;
  flex-direction: column;
  position: relative;
  transition:
    box-shadow 0.2s ease,
    border-color 0.2s ease;
}
.quicktech-products-card:hover {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
  border-color: #e2e8f0;
}

/* Full Card Clickable Link overlay */
.quicktech-products-full-link {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  border-radius: 12px;
}

/* Discount Badge */
.quicktech-products-badge {
  position: absolute;
  top: 16px;
  left: 16px;
  background-color: #dc2626;
  color: #ffffff;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 4px 8px;
  border-radius: 4px;
  z-index: 2;
}

/* Product Image */
.quicktech-products-img-wrap {
  height: 149px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  padding: 0px;
}
.quicktech-products-img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

/* Product Info */
.quicktech-products-info {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}
.quicktech-products-name {
  font-size: 0.95rem;
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 4px;
  line-height: 1.3;
}
.quicktech-products-type {
  font-size: 0.8rem;
  color: #94a3b8;
  margin-bottom: 8px;
}

/* Rating Stars */
.quicktech-products-rating {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 2px;
}
.quicktech-products-star {
  color: #facc15;
  font-size: 0.75rem;
}
.quicktech-products-rating-count {
  color: #94a3b8;
  font-size: 0.8rem;
  margin-left: 4px;
}

/* Price Area */
.quicktech-products-price-wrap {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 16px;
  margin-top: auto;
}
.quicktech-products-price-current {
  font-size: 1.15rem;
  font-weight: 700;
  color: #21428a;
}
.quicktech-products-price-old {
  font-size: 0.85rem;
  color: #94a3b8;
  text-decoration: line-through;
}

/* Add to Cart Button Wrap */
.quicktech-products-btn-wrap {
  position: relative;
  width: 100%;
  z-index: 2; /* Sits above the link overlay so the button remains clickable */
}
.quicktech-products-btn {
  width: 100%;
  background-color: #21428a;
  color: #ffffff;
  border: none;
  border-radius: 8px;
  padding: 10px;
  font-size: 0.9rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: background-color 0.2s ease;
}
.quicktech-products-btn:hover {
  background-color: #21428ad6;
  color: #ffffff;
}
.quicktech-products-btn::after {
  display: none;
}

/* Select Quantity Dropdown Popup */
.quicktech-products-dropdown {
  width: 100%;
  min-width: 180px;
  padding: 0;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
  margin-top: 4px !important;
  z-index: 1050;
}
.quicktech-products-dropdown-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px;
  border-bottom: 1px solid #e2e8f0;
}
.quicktech-products-dropdown-title {
  font-size: 0.95rem;
  font-weight: 500;
  color: #1e293b;
  margin: 0;
}
.quicktech-products-dropdown-close {
  cursor: pointer;
  color: #64748b;
  font-size: 1.1rem;
  background: none;
  border: none;
  padding: 0;
  line-height: 1;
}

.quicktech-products-dropdown-list {
  list-style: none;
  margin: 0;
  padding: 0;
  max-height: 185px;
  overflow-y: auto;
}
.quicktech-products-dropdown-list::-webkit-scrollbar {
  width: 6px;
}
.quicktech-products-dropdown-list::-webkit-scrollbar-thumb {
  background-color: #cbd5e1;
  border-radius: 4px;
}
.quicktech-products-dropdown-item {
  display: block;
  padding: 12px 16px;
  font-size: 0.95rem;
  color: #1e293b;
  text-decoration: none;
  border-bottom: 1px solid #f1f5f9;
  transition: background-color 0.1s;
}
.quicktech-products-dropdown-item:last-child {
  border-bottom: none;
}
.quicktech-products-dropdown-item:hover,
.quicktech-products-dropdown-item:focus {
  background-color: #f8fafc;
  color: #21428a;
}

.quicktech-product-cart-container {
  width: 100%;
  max-width: 100%;
  background-color: #ffffff;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
  padding: 24px;
}

/* Header */
.quicktech-product-cart-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding-bottom: 16px;
  border-bottom: 1px solid #f1f5f9;
  margin-bottom: 16px;
}

.quicktech-product-cart-title-wrap {
  display: flex;
  align-items: baseline;
  gap: 6px;
}

.quicktech-product-cart-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: #1e293b;
}

.quicktech-product-cart-count {
  font-size: 0.95rem;
  color: #94a3b8;
  font-weight: 400;
}

.quicktech-product-cart-edit {
  font-size: 0.9rem;
  font-weight: 500;
  color: #21428a; /* Teal brand color */
  text-decoration: none;
  cursor: pointer;
}

/* Cart Items List */
.quicktech-product-cart-items {
  display: flex;
  flex-direction: column;
}

/* Individual Item */
.quicktech-product-cart-item {
  display: flex;
  padding: 16px 0;
  border-bottom: 1px solid #f1f5f9;
  position: relative;
}

.quicktech-product-cart-item:last-child {
  border-bottom: none;
}

/* Item Image */
.quicktech-product-cart-img-box {
  width: 64px;
  height: 64px;
  border: 1px solid #f1f5f9;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px;
  flex-shrink: 0;
}

.quicktech-product-cart-img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

/* Item Details */
.quicktech-product-cart-details {
  margin-left: 16px;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}

.quicktech-product-cart-item-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.quicktech-product-cart-name {
  font-size: 0.95rem;
  font-weight: 600;
  color: #1e293b;
  margin-bottom: 2px;
  padding-right: 20px;
}

.quicktech-product-cart-remove {
  color: #64748b;
  background: none;
  border: none;
  cursor: pointer;
  font-size: 1rem;
  position: absolute;
  right: 0;
  top: 16px;
}

.quicktech-product-cart-type {
  font-size: 0.8rem;
  color: #94a3b8;
  margin-bottom: 4px;
}

.quicktech-product-cart-unit-price {
  font-size: 0.85rem;
  color: #64748b;
  margin-bottom: 12px;
}

/* Quantity and Item Total */
.quicktech-product-cart-qty-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: auto;
}

.quicktech-product-cart-qty-ctrl {
  display: flex;
  align-items: center;
  background-color: #f8fafc;
  border: 1px solid #f1f5f9;
  border-radius: 6px;
  height: 32px;
}

.quicktech-product-cart-qty-btn {
  width: 32px;
  height: 100%;
  background: none;
  border: none;
  color: #64748b;
  font-size: 1rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.2s;
}

.quicktech-product-cart-qty-btn:hover {
  background-color: #e2e8f0;
  border-radius: 6px;
}

.quicktech-product-cart-qty-val {
  width: 24px;
  text-align: center;
  font-size: 0.95rem;
  font-weight: 600;
  color: #1e293b;
}

.quicktech-product-cart-item-total {
  font-size: 1rem;
  font-weight: 700;
  color: #1e293b;
}

/* Summary Section */
.quicktech-product-cart-summary {
  margin-top: 8px;
  padding-top: 16px;
  border-top: 1px dashed #cbd5e1;
}

.quicktech-product-cart-summary-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
  font-size: 0.95rem;
  color: #475569;
  font-weight: 500;
}

.quicktech-product-cart-summary-val {
  font-weight: 600;
  color: #1e293b;
}

.quicktech-product-cart-delivery {
  color: #16a34a; /* Green */
}
.quicktech-product-cart-delivery-val {
  color: #16a34a;
  font-weight: 600;
}

.quicktech-product-cart-grand-total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 16px;
  margin-bottom: 24px;
}

.quicktech-product-cart-total-label {
  font-size: 1.1rem;
  font-weight: 700;
  color: #1e293b;
}

.quicktech-product-cart-total-val {
  font-size: 1.25rem;
  font-weight: 700;
  color: #21428a; /* Teal brand color */
}

/* Action Buttons */
.quicktech-product-cart-actions {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.quicktech-product-cart-btn-primary {
  width: 100%;
  background-color: #21428a;
  color: #ffffff;
  border: none;
  border-radius: 8px;
  padding: 14px;
  font-size: 1rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  cursor: pointer;
  transition: background-color 0.2s;
}

.quicktech-product-cart-btn-primary:hover {
  background-color: #21428ad6;
}

.quicktech-product-cart-btn-secondary {
  width: 100%;
  background-color: #ffffff;
  color: #21428a;
  border: 1px solid #21428a;
  border-radius: 8px;
  padding: 14px;
  font-size: 1rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  cursor: pointer;
  transition: background-color 0.2s;
}

.quicktech-product-cart-btn-secondary:hover {
  background-color: #f8fafc;
}

.quikctech-product-gg {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;

  padding: 20px;
}

.quicktech-banner-card {
  padding: 24px;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  overflow: hidden;
  min-height: 160px;
}
.quicktech-app-serv-icon-box i {
  color: #21428a;
}
/* Card 1: Green */
.banner-1 {
  background-color: #1f6f5d;
  color: #ffffff;
}
/* Card 2: Light Blue */
.banner-2 {
  background-color: #eaf4ff;
  color: #1e293b;
}
/* Card 3: Light Green */
.banner-3 {
  background-color: #e8f5e9;
  color: #1e293b;
}

.banner-title {
  font-size: 1.4rem;
  font-weight: 700;
  margin-bottom: 4px;
}
.banner-subtitle {
  font-size: 0.95rem;
  margin-bottom: 12px;
}

.code-box {
  background: #ffffff;
  color: #1f6f5d;
  padding: 6px 12px;
  border-radius: 6px;
  font-weight: 700;
  display: inline-block;
  width: fit-content;
}

.banner-features {
  font-size: 0.9rem;
  font-weight: 600;
  color: #0f766e;
}

.banner-img {
  position: absolute;
  right: 16px;
  bottom: 16px;
  max-width: 100px;
  object-fit: contain;
}

@media (max-width: 992px) {
  .quikctech-product-gg {
    grid-template-columns: 1fr;
  }
}

/* product */

:root {
  --teal-900: #21428a;
  --teal-700: #21428a;
  --teal-500: #21428a;
  --teal-100: #21428a24;
  --green-600: #00838f;
  --green-100: #00838f33;
  --ink: #16232b;
  --slate: #5c6b73;
  --slate-light: #8a98a0;
  --line: #e4eaec;
  --bg-tint: #f5f9f9;
  --white: #ffffff;
  --amber: #b8791a;
  --amber-bg: #fdf3e3;
  --red: #c4432b;
  --red-bg: #fbeae6;
  --radius-lg: 20px;
  --radius-md: 14px;
  --radius-sm: 9px;
  --shadow-sm:
    0 1px 2px rgba(11, 59, 69, 0.06), 0 1px 1px rgba(11, 59, 69, 0.04);
  --shadow-md: 0 8px 24px rgba(11, 59, 69, 0.08);
  --shadow-lg: 0 20px 48px rgba(11, 59, 69, 0.14);
}
.gallery-badges span {
  border-radius: 20px;
  padding: 5px 20px;
  font-size: 12px;
}
/* ---------- breadcrumb ---------- */
.breadcrumb {
  font-size: 12.5px;
  color: var(--slate);
  padding: 16px 0;
}
.breadcrumb a:hover {
  color: var(--teal-700);
}
.breadcrumb .sep {
  margin: 0 6px;
  color: var(--slate-light);
}

/* ---------- product hero ---------- */
.product-hero {
  display: grid;
  grid-template-columns: 460px 1fr 340px;
  gap: 32px;
  align-items: start;
  padding-bottom: 40px;
}
@media (max-width: 1080px) {
  .product-hero {
    grid-template-columns: 1fr;
  }
}

/* gallery */
/* .gallery {
  position: sticky;
  top: 82px;
} */
.main-img-wrap {
  border-radius: var(--radius-lg);
  border: 1px solid var(--line);
  background: var(--bg-tint);
  aspect-ratio: 1/1;
  position: relative;
  overflow: hidden;
  cursor: zoom-in;
}
.main-img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform 0.35s ease;
}
.main-img-wrap:hover img {
  transform: scale(1.06);
}
.zoom-hint {
  position: absolute;
  bottom: 12px;
  right: 12px;
  background: rgba(11, 59, 69, 0.82);
  color: #fff;
  font-size: 11.5px;
  font-weight: 600;
  padding: 6px 10px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  gap: 5px;
}
.gallery-badges {
  position: absolute;
  top: 12px;
  left: 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.thumbs {
  display: flex;
  gap: 10px;
  margin-top: 12px;
  overflow-x: auto;
  padding-bottom: 2px;
  flex-wrap: wrap;
}
.thumb {
  width: 74px;
  height: 74px;
  flex: none;
  border-radius: var(--radius-sm);
  border: 2px solid var(--line);
  background: var(--bg-tint);
  overflow: hidden;
  cursor: pointer;
  transition:
    border-color 0.2s,
    transform 0.2s;
}
.thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.thumb.active {
  border-color: var(--teal-700);
}
.thumb:hover {
  transform: translateY(-2px);
}
.fullscreen-btn {
  margin-top: 12px;
  width: 100%;
  padding: 11px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--line);
  font-size: 13px;
  font-weight: 600;
  color: var(--teal-700);
  background: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: 0.2s;
}
.fullscreen-btn:hover {
  background: var(--teal-100);
  border-color: var(--teal-500);
}

/* fullscreen modal */
.lightbox {
  position: fixed;
  inset: 0;
  background: rgba(11, 25, 29, 0.92);
  z-index: 200;
  display: none;
  align-items: center;
  justify-content: center;
}
.lightbox.open {
  display: flex;
}
.lightbox img {
  max-width: 88vw;
  max-height: 82vh;
  object-fit: contain;
  border-radius: 12px;
}
.lightbox-close {
  position: absolute;
  top: 24px;
  right: 28px;
  color: #fff;
  font-size: 28px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.12);
}
.lightbox-close:hover {
  background: rgba(255, 255, 255, 0.24);
}

/* info column */
.product-info h1 {
  font-size: 28px;
  font-weight: 700;
  line-height: 1.25;
  margin-bottom: 6px;
}
.generic-line {
  font-size: 14.5px;
  color: var(--slate);
  margin-bottom: 14px;
}
.generic-line b {
  color: var(--teal-700);
  font-weight: 600;
}
.meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 18px;
}
.meta-chip {
  font-size: 12px;
  font-weight: 600;
  color: var(--teal-700);
  background: var(--teal-100);
  padding: 5px 11px;
  border-radius: 999px;
}
.rating-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 20px;
}
.stars {
  color: #e8a33d;
  font-size: 15px;
  letter-spacing: 1px;
}
.rating-row .count {
  font-size: 13px;
  color: var(--slate);
}
.rating-row .count a {
  color: var(--teal-700);
  font-weight: 600;
}

.info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 24px;
  padding: 18px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  margin-bottom: 22px;
}
.info-grid .item {
  font-size: 13.5px;
}
.info-grid .item .label {
  color: var(--slate-light);
  font-size: 11.5px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  display: block;
  margin-bottom: 3px;
}
.info-grid .item .value {
  font-weight: 600;
  color: var(--ink);
}

.section-label {
  font-size: 13px;
  font-weight: 700;
  color: var(--teal-900);
  margin-bottom: 10px;
  display: block;
}
.variant-group {
  margin-bottom: 20px;
}
.variant-options {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.variant-btn {
  padding: 9px 16px;
  border-radius: var(--radius-sm);
  border: 1.5px solid var(--line);
  font-size: 13.5px;
  font-weight: 600;
  background: var(--white);
  transition: 0.2s;
}
.variant-btn:hover {
  border-color: var(--teal-500);
}
.variant-btn.selected {
  border-color: var(--teal-700);
  background: var(--teal-700);
  color: #fff;
}
.variant-btn .sub {
  display: block;
  font-size: 11px;
  font-weight: 500;
  opacity: 0.75;
  margin-top: 1px;
}

.rx-box {
  border-radius: var(--radius-md);
  padding: 16px;
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 20px;
}
.rx-required {
  background: var(--red-bg);
  border: 1px solid #f0c7bc;
}
.rx-notrequired {
  background: var(--green-100);
  border: 1px solid #bfe7d8;
}
.rx-icon {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  flex: none;
}
.rx-required .rx-icon {
  background: #f3d2c7;
  color: var(--red);
}
.rx-notrequired .rx-icon {
  background: #cfeee1;
  color: var(--green-600);
}
.rx-box .rx-title {
  font-weight: 700;
  font-size: 14px;
  margin-bottom: 2px;
}
.rx-required .rx-title {
  color: #8e3420;
}
.rx-notrequired .rx-title {
  color: #166b4e;
}
.rx-box .rx-desc {
  font-size: 12.5px;
  color: var(--slate);
}

.upload-zone {
  border: 2px dashed #c9dee2;
  border-radius: var(--radius-md);
  padding: 22px 16px;
  text-align: center;
  background: var(--teal-100);
  cursor: pointer;
  transition: 0.2s;
  margin-bottom: 6px;
}
.upload-zone:hover {
  border-color: var(--teal-500);
  background: #dceef1;
}
.upload-zone .up-icon {
  font-size: 26px;
  margin-bottom: 8px;
}
.upload-zone .up-title {
  font-weight: 700;
  font-size: 13.5px;
  color: var(--teal-900);
  margin-bottom: 3px;
}
.upload-zone .up-sub {
  font-size: 11.5px;
  color: var(--slate);
}
.upload-formats {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 10px;
}
.fmt-chip {
  font-size: 10.5px;
  font-weight: 700;
  background: var(--white);
  border: 1px solid var(--line);
  padding: 3px 9px;
  border-radius: 6px;
  color: var(--slate);
}

/* buy box */
.buy-box {
  position: sticky;
  top: 82px;
}
.price-block {
  padding: 20px 20px 16px;
  border-bottom: 1px solid var(--line);
}
.price-row {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
}
.price-now {
  font-family: "Sora";
  font-size: 28px;
  font-weight: 800;
  color: var(--teal-900);
}
.price-old {
  font-size: 15px;
  color: var(--slate-light);
  text-decoration: line-through;
}
.discount-tag {
  background: var(--green-600);
  color: #fff;
  font-size: 11.5px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 6px;
}
.price-per {
  font-size: 12px;
  color: var(--slate);
  margin-top: 4px;
}
.stock-row {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 12px;
  font-size: 13px;
  font-weight: 600;
}
.dot {
  /* width: 8px;
  height: 8px; */
  border-radius: 50%;
  background: var(--green-600);
}
.dot.low {
  background: var(--amber);
}
.stock-instock {
  color: var(--green-600);
}
.stock-low {
  color: var(--amber);
}

.qty-block {
  padding: 16px 20px;
  border-bottom: 1px solid var(--line);
}
.qty-selector {
  display: flex;
  align-items: center;
  border: 1.5px solid var(--line);
  border-radius: var(--radius-sm);
  width: fit-content;
  overflow: hidden;
}
.qty-selector button {
  width: 38px;
  height: 38px;
  font-size: 18px;
  color: var(--teal-700);
  font-weight: 700;
  transition: background 0.2s;
}
.qty-selector button:hover {
  background: var(--teal-100);
}
.qty-selector input {
  width: 46px;
  height: 38px;
  border: none;
  text-align: center;
  font-size: 15px;
  font-weight: 700;
  border-left: 1px solid var(--line);
  border-right: 1px solid var(--line);
}

.action-block {
  padding: 18px 20px 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.btn {
  padding: 13px 18px;
  border-radius: var(--radius-sm);
  font-weight: 700;
  font-size: 14.5px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition:
    transform 0.15s,
    box-shadow 0.15s,
    background 0.2s;
}
.btn:active {
  transform: scale(0.98);
}
.btn-primary {
  background: var(--teal-700);
  color: #fff;
  box-shadow: 0 6px 16px rgba(11, 93, 111, 0.28);
}
.btn-primary:hover {
  background: var(--teal-900);
}
.btn-buynow {
  background: var(--green-600);
  color: #fff;
  box-shadow: 0 6px 16px rgba(31, 163, 122, 0.28);
}
.btn-buynow:hover {
  background: #188566;
}
.icon-row {
  display: flex;
  gap: 10px;
}
.btn-outline {
  flex: 1;
  border: 1.5px solid var(--line);
  color: var(--teal-900);
  background: #fff;
  font-size: 13px;
}
.btn-outline:hover {
  border-color: var(--teal-500);
  background: var(--teal-100);
}

.trust-badges {
  padding: 16px 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.trust-badges .tb-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--teal-900);
}
.trust-badges .tb-icon {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: var(--green-100);
  color: var(--green-600);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  flex: none;
}

.delivery-card {
  margin-top: 18px;
  padding: 16px 18px;
}
.delivery-card h4 {
  font-size: 13.5px;
  margin-bottom: 10px;
}
.delivery-row {
  display: flex;
  justify-content: space-between;
  font-size: 12.5px;
  padding: 6px 0;
  border-bottom: 1px dashed var(--line);
  color: var(--slate);
}
.delivery-row:last-child {
  border-bottom: none;
}
.delivery-row b {
  color: var(--ink);
}

/* ---------- tabs section ---------- */
.detail-tabs {
  margin-top: 8px;
  border-top: 8px solid var(--bg-tint);
  padding-top: 36px;
}
.tabnav {
  display: flex;
  gap: 6px;
  border-bottom: 1px solid var(--line);
  overflow-x: auto;
  margin-bottom: 28px;
}
.tabnav button {
  padding: 12px 18px;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--slate);
  white-space: nowrap;
  border-bottom: 2.5px solid transparent;
  transition: 0.2s;
}
.tabnav button:hover {
  color: var(--teal-700);
}
.tabnav button.active {
  color: var(--teal-700);
  border-bottom-color: var(--teal-700);
}
.tab-panel {
  display: none;
}
.tab-panel.active {
  display: block;
  animation: fadeUp 0.4s ease;
}
.tab-panel h3 {
  font-size: 16px;
  margin: 22px 0 10px;
}
.tab-panel h3:first-child {
  margin-top: 0;
}
.tab-panel p,
.tab-panel li {
  font-size: 14px;
  color: #3b4a51;
  line-height: 1.75;
}
.tab-panel ul {
  padding-left: 20px;
  margin-bottom: 6px;
}
.tab-panel ul li {
  margin-bottom: 4px;
}
.warning-callout {
  background: var(--amber-bg);
  border: 1px solid #edd6a8;
  border-left: 4px solid var(--amber);
  border-radius: 10px;
  padding: 14px 16px;
  margin: 16px 0;
  font-size: 13.5px;
  color: #6e4d14;
}
.warning-callout b {
  display: block;
  margin-bottom: 4px;
  color: #8e5d0e;
}

.spec-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13.5px;
}
.spec-table tr {
  border-bottom: 1px solid var(--line);
}
.spec-table tr:last-child {
  border-bottom: none;
}
.spec-table td {
  padding: 12px 14px;
}
.spec-table td:first-child {
  color: var(--slate);
  width: 38%;
  font-weight: 500;
}
.spec-table td:last-child {
  font-weight: 600;
  color: var(--ink);
}
.spec-table tr:nth-child(odd) {
  background: var(--bg-tint);
}

/* ---------- related products ---------- */
.related-wrap {
  margin-top: 48px;
}
.section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 20px;
}
.section-head h2 {
  font-size: 21px;
}
.section-head .see-all {
  font-size: 13px;
  font-weight: 600;
  color: var(--teal-700);
}
.rel-scroll {
  display: flex;
  gap: 16px;
  overflow-x: auto;
  padding-bottom: 10px;
}
.rel-card {
  flex: none;
  width: 206px;
  padding: 14px;
  transition:
    transform 0.2s,
    box-shadow 0.2s;
}
.rel-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}
.rel-card .rel-img {
  background: var(--bg-tint);
  border-radius: 12px;
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
  overflow: hidden;
}
.rel-card .rel-name {
  font-size: 13.5px;
  font-weight: 700;
  margin-bottom: 2px;
}
.rel-card .rel-sub {
  font-size: 11.5px;
  color: var(--slate);
  margin-bottom: 8px;
}
.rel-card .rel-price {
  font-size: 14px;
  font-weight: 800;
  color: var(--teal-900);
}
.rel-card .rel-old {
  font-size: 11.5px;
  color: var(--slate-light);
  text-decoration: line-through;
  margin-left: 6px;
}
.rel-card .alt-tag {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  color: var(--green-600);
  background: var(--green-100);
  padding: 2px 7px;
  border-radius: 6px;
  margin-bottom: 6px;
}

/* ---------- reviews ---------- */
.reviews-wrap {
  margin-top: 48px;
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 32px;
}
@media (max-width: 800px) {
  .reviews-wrap {
    grid-template-columns: 1fr;
  }
}
.review-summary {
  padding: 24px;
  text-align: center;
  height: fit-content;
}
.review-summary .big-score {
  font-family: "Sora";
  font-size: 44px;
  font-weight: 800;
  color: var(--teal-900);
}
.review-summary .stars {
  font-size: 19px;
  margin: 6px 0;
}
.review-summary .total {
  font-size: 12.5px;
  color: var(--slate);
  margin-bottom: 18px;
}
.bar-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--slate);
  margin-bottom: 6px;
}
.bar-track {
  flex: 1;
  height: 6px;
  background: var(--bg-tint);
  border-radius: 999px;
  overflow: hidden;
}
.bar-fill {
  height: 100%;
  background: var(--amber);
  border-radius: 999px;
}
.write-review-btn {
  margin-top: 16px;
  width: 100%;
  padding: 11px;
  border-radius: var(--radius-sm);
  background: var(--teal-700);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
}
.write-review-btn:hover {
  background: var(--teal-900);
}

.review-item {
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
}
.review-item:first-child {
  padding-top: 0;
}
.review-head {
  display: flex;
  align-items: center;
  justify-content: between;
  gap: 10px;
  margin-bottom: 6px;
}
.review-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--teal-100);
  color: var(--teal-700);
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
}
.review-name-wrap {
  flex: 1;
}
.review-name {
  font-size: 13.5px;
  font-weight: 700;
}
.review-date {
  font-size: 11.5px;
  color: var(--slate-light);
}
.review-stars {
  color: #e8a33d;
  font-size: 12.5px;
  margin: 4px 0 8px;
}
.verified-tag {
  font-size: 10.5px;
  font-weight: 700;
  color: var(--green-600);
  background: var(--green-100);
  padding: 2px 7px;
  border-radius: 6px;
  margin-left: 8px;
}
.review-text {
  font-size: 13.5px;
  color: #3b4a51;
  line-height: 1.7;
}

/* mobile sticky buy bar */
.mobile-buy-bar {
  display: none;
}
@media (max-width: 1080px) {
  .buy-box {
    position: static;
  }
}
@media (max-width: 640px) {
  .product-hero {
    padding-bottom: 96px;
  }
  .mobile-buy-bar {
    display: flex;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
    border-top: 1px solid var(--line);
    padding: 10px 14px;
    gap: 10px;
    box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.08);
    z-index: 60;
  }
  .mobile-buy-bar .btn {
    flex: 1;
    padding: 12px;
    font-size: 13.5px;
  }
}

.quikctech-pp-grid {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important;
}

/* about */
.quicktech-about-wrap {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 24px;
}
.quicktech-about-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #21428a;
  margin-bottom: 14px;
}
.quicktech-about-eyebrow::before {
  content: "";
  width: 20px;
  height: 2px;
  background: #21428a;
  display: inline-block;
}

/* HERO */
.quicktech-about-hero {
  background: #21428a12;
  padding: 88px 0 96px;
  position: relative;
  overflow: hidden;
}
.quicktech-about-hero::after {
  content: "";
  position: absolute;
  right: -120px;
  top: -120px;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  background: #21428a42;
  z-index: 0;
}
.quicktech-about-hero-inner {
  position: relative;
  z-index: 1;
  max-width: 760px;
}
.quicktech-about-hero h1 {
  font-size: clamp(34px, 5vw, 54px);
  margin-bottom: 22px;
}
.quicktech-about-hero h1 span {
  color: #21428a;
}
.quicktech-about-hero p {
  font-size: 18px;
  color: #3e524c;
  max-width: 600px;
}
.quicktech-about-hero-stats {
  display: flex;
  gap: 40px;
  margin-top: 44px;
  flex-wrap: wrap;
}
.quicktech-about-hero-stats div {
  border-left: 2px solid #21428a;
  padding-left: 14px;
}
.quicktech-about-hero-stats strong {
  display: block;

  font-size: 30px;
  color: #21428a;
}
.quicktech-about-hero-stats span {
  font-size: 13px;
  color: #6b8079;
}

/* STORY */
.quicktech-about-story {
  padding: 96px 0;
}
.quicktech-about-story .quicktech-about-grid {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 64px;
  align-items: center;
}
.quicktech-about-story-visual {
  background: #21428a;
  border-radius: 20px;
  padding: 40px;
  color: #21428a12;
  position: relative;
  min-height: 360px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.quicktech-about-story-visual .quicktech-about-badge-call {
  font-size: 26px;
  color: #fff;
  margin-bottom: 14px;
}
.quicktech-about-story-visual p {
  color: #b9d6cd;
  font-size: 15px;
}
.quicktech-about-story-visual .quicktech-about-pulse {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #21428a;
  display: inline-block;
  margin-right: 10px;
  box-shadow: 0 0 0 6px rgba(255, 107, 74, 0.18);
}
.quicktech-about-story-visual .quicktech-about-row {
  display: flex;
  align-items: center;
  margin-top: 18px;
  font-size: 14px;
  color: #dcefe9;
}
.quicktech-about-story h2 {
  font-size: 32px;
  margin-bottom: 18px;
}
.quicktech-about-story p {
  margin-bottom: 16px;
  font-size: 16px;
}
.quicktech-about-story p strong {
  color: #21428a;
}

/* MISSION / VALUES — signature timeline */
.quicktech-about-route {
  background: #21428a12;
  padding: 100px 0;
}
.quicktech-about-route-head {
  max-width: 640px;
  margin-bottom: 64px;
}
.quicktech-about-route-head h2 {
  font-size: 32px;
}
.quicktech-about-route-head p {
  font-size: 16px;
  margin-top: 12px;
}
.quicktech-about-route-line {
  position: relative;
  padding-left: 48px;
}
.quicktech-about-route-line::before {
  content: "";
  position: absolute;
  left: 11px;
  top: 8px;
  bottom: 8px;
  width: 2px;
  background: repeating-linear-gradient(
    to bottom,
    #21428a 0 8px,
    transparent 8px 16px
  );
}
.quicktech-about-stop {
  position: relative;
  padding-bottom: 52px;
}
.quicktech-about-stop:last-child {
  padding-bottom: 0;
}
.quicktech-about-stop::before {
  content: "";
  position: absolute;
  left: -48px;
  top: 2px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #ffffff;
  border: 2px solid #21428a;
}
.quicktech-about-stop::after {
  content: attr(data-n);
  position: absolute;
  left: -41px;
  top: 6px;
  width: 16px;
  height: 16px;
  font-size: 10px;
  font-weight: 700;
  color: #21428a;
  font-family: "Inter", sans-serif;
}
.quicktech-about-stop h3 {
  font-size: 20px;
  margin-bottom: 8px;
  color: #21428a;
}
.quicktech-about-stop p {
  font-size: 15px;
  color: #3e524c;
  max-width: 620px;
}
.quicktech-about-stop .quicktech-about-tag {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  color: #21428a;
  background: #ffede7;
  padding: 3px 10px;
  border-radius: 20px;
  margin-bottom: 10px;
}

/* VALUES GRID */
.quicktech-about-values {
  padding: 96px 0;
}
.quicktech-about-values-head {
  max-width: 600px;
  margin-bottom: 48px;
}
.quicktech-about-values-head h2 {
  font-size: 32px;
}
.quicktech-about-values-head p {
  margin-top: 12px;
  font-size: 16px;
}
.quicktech-about-v-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
.quicktech-about-v-card {
  border: 1px solid #dceae5;
  border-radius: 16px;
  padding: 28px 22px;
  transition:
    border-color 0.2s ease,
    transform 0.2s ease;
}
.quicktech-about-v-card:hover {
  border-color: #21428a;
  transform: translateY(-4px);
}
.quicktech-about-v-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: #21428a42;
  color: #21428a;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  margin-bottom: 18px;

  font-weight: 600;
}
.quicktech-about-v-card h4 {
  font-size: 17px;
  margin-bottom: 8px;
}
.quicktech-about-v-card p {
  font-size: 14px;
  color: #6b8079;
}

/* TEAM */
.quicktech-about-team {
  background: #21428a;
  padding: 96px 0;
  color: #21428a12;
}
.quicktech-about-team-head {
  max-width: 600px;
  margin-bottom: 48px;
}
.quicktech-about-team-head .quicktech-about-eyebrow {
  color: #7fcbb4;
}
.quicktech-about-team-head .quicktech-about-eyebrow::before {
  background: #21428a;
}
.quicktech-about-team-head h2 {
  color: #fff;
  font-size: 32px;
}
.quicktech-about-team-head p {
  color: #b9d6cd;
  margin-top: 12px;
  font-size: 16px;
}
.quicktech-about-t-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
.quicktech-about-t-card {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 16px;
  padding: 24px;
  text-align: center;
}
.quicktech-about-t-avatar {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: #21428a;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 22px;
  margin: 0 auto 14px;
}
.quicktech-about-t-card h4 {
  color: #fff;
  font-size: 16px;
  margin-bottom: 4px;
  font-family: "Inter", sans-serif;
  font-weight: 600;
}
.quicktech-about-t-card span {
  font-size: 13px;
  color: white;
}

/* CTA */
.quicktech-about-cta {
  padding: 90px 0;
  text-align: center;
}
.quicktech-about-cta-box {
  background: #21428a42;
  border-radius: 24px;
  padding: 64px 32px;
}
.quicktech-about-cta h2 {
  font-size: 30px;
  margin-bottom: 16px;
}
.quicktech-about-cta p {
  font-size: 16px;
  max-width: 520px;
  margin: 0 auto 32px;
  color: #3e524c;
}
.quicktech-about-cta-actions {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
}
.quicktech-about-btn {
  padding: 14px 30px;
  border-radius: 10px;
  font-weight: 600;
  font-size: 15px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.quicktech-about-btn-primary {
  background: #21428a;
  color: #fff;
}
.quicktech-about-btn-primary:hover {
  background: #21428a;
}
.quicktech-about-btn-outline {
  border: 1.5px solid #21428a;
  color: #21428a;
}
.quicktech-about-btn-outline:hover {
  background: #21428a;
  color: #fff;
}

@media (max-width: 900px) {
  .quicktech-about-story .quicktech-about-grid {
    grid-template-columns: 1fr;
  }
  .quicktech-about-v-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .quicktech-about-t-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .quicktech-about-hero {
    padding: 64px 0;
  }
  .quicktech-about-story,
  .quicktech-about-route,
  .quicktech-about-values,
  .quicktech-about-team,
  .quicktech-about-cta {
    padding: 64px 0;
  }
}
@media (max-width: 520px) {
  .quicktech-about-v-grid,
  .quicktech-about-t-grid {
    grid-template-columns: 1fr 1fr;
  }
  .quicktech-about-hero-stats {
    gap: 24px;
  }
}

/* about */

/* contact */

.quickTech-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #21428a;
  margin-bottom: 14px;
}
.quickTech-eyebrow::before {
  content: "";
  width: 20px;
  height: 2px;
  background: #21428a;
  display: inline-block;
}

/* HERO */
.quickTech-hero {
  background: #21428a12;
  padding: 80px 0 56px;
}
.quickTech-hero h1 {
  font-size: clamp(32px, 4.5vw, 48px);
  max-width: 680px;
  margin-bottom: 16px;
}
.quickTech-hero p {
  font-size: 17px;
  max-width: 560px;
  color: #3e524c;
}

/* QUICK CONTACT CARDS */
.quickTech-quickcards {
  padding: 56px 0 0;
}
.quickTech-cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.quickTech-card {
  border: 1px solid #dceae5;
  border-radius: 16px;
  padding: 28px 24px;
  transition:
    border-color 0.2s ease,
    transform 0.2s ease;
}
.quickTech-card:hover {
  border-color: #21428a;
  transform: translateY(-4px);
}
.quickTech-card-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: #21428a12;
  color: #21428a;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  margin-bottom: 18px;
  font-family: "Fraunces", serif;
  font-weight: 600;
}
.quickTech-card h3 {
  font-size: 17px;
  margin-bottom: 8px;
}
.quickTech-card p {
  font-size: 14px;
  color: #6b8079;
  margin-bottom: 14px;
}
.quickTech-card a.quickTech-card-link {
  font-size: 14px;
  font-weight: 600;
  color: #21428a;
}

/* MAIN CONTACT SECTION */
.quickTech-main {
  padding: 88px 0 96px;
}
.quickTech-main-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: flex-start;
}

/* FORM */
.quickTech-form-box h2 {
  font-size: 28px;
  margin-bottom: 10px;
}
.quickTech-form-box > p {
  font-size: 15px;
  color: #6b8079;
  margin-bottom: 32px;
}
.quickTech-form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.quickTech-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.quickTech-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.quickTech-field label {
  font-size: 13px;
  font-weight: 600;
  color: #21428a;
}
.quickTech-field input,
.quickTech-field select,
.quickTech-field textarea {
  padding: 13px 14px;
  border: 1px solid #dceae5;
  border-radius: 10px;
  font-family: "Inter", sans-serif;
  font-size: 14px;
  color: #3e524c;
  outline: none;
}
.quickTech-field input:focus,
.quickTech-field select:focus,
.quickTech-field textarea:focus {
  border-color: #21428a;
}
.quickTech-field textarea {
  resize: vertical;
  min-height: 120px;
}
.quickTech-submit {
  margin-top: 8px;
  padding: 15px 28px;
  border: none;
  border-radius: 10px;
  background: #21428a;
  color: #fff;
  font-weight: 600;
  font-size: 15px;
  width: fit-content;
  cursor: pointer;
}
.quickTech-submit:hover {
  background: #21428a;
}

/* INFO SIDE */
.quickTech-info-box {
  background: #21428a;
  border-radius: 20px;
  padding: 40px;
  color: #21428a12;
}
.quickTech-info-box h3 {
  color: #fff;
  font-size: 20px;
  margin-bottom: 6px;
}
.quickTech-info-box > p {
  color: #b9d6cd;
  font-size: 14px;
  margin-bottom: 28px;
}
.quickTech-info-row {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 16px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.quickTech-info-row:first-of-type {
  border-top: none;
}
.quickTech-info-icon {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.08);
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
}

.quicktech-appointment-set-btn-primary:hover {
  color: white;
}

.quickTech-info-row h4 {
  color: #fff;
  font-size: 14px;
  margin-bottom: 4px;
  font-family: "Inter", sans-serif;
  font-weight: 600;
}
.quickTech-info-row span {
  font-size: 13px;
  color: #b9d6cd;
  display: block;
}

.quickTech-social {
  display: flex;
  gap: 10px;
  margin-top: 28px;
}
.quickTech-social a {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
}
.quickTech-social a:hover {
  background: #21428a;
}

/* MAP */
.quickTech-map {
  padding: 0 0 0;
}
.quickTech-map-box {
  height: 340px;
  border-radius: 20px;
  background: #21428a12;
  border: 1px solid #dceae5;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Fraunces", serif;
  color: #21428a;
  font-size: 16px;
  position: relative;
  overflow: hidden;
}
.quickTech-map-box::before {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    45deg,
    rgba(12, 131, 117, 0.04) 0 2px,
    transparent 2px 26px
  );
}
.quickTech-map-pin {
  position: relative;
  z-index: 1;
  text-align: center;
  width: 100%;
}
.quickTech-map-pin span {
  display: block;
  font-size: 13px;
  color: #6b8079;
  font-family: "Inter", sans-serif;
  margin-top: 6px;
}

/* FAQ */
.quickTech-faq {
  background: #21428a12;
  padding: 88px 0;
}
.quickTech-faq-head {
  max-width: 600px;
  margin-bottom: 40px;
}
.quickTech-faq-head h2 {
  font-size: 28px;
}
.quickTech-faq-head p {
  margin-top: 10px;
  font-size: 15px;
}
.quickTech-faq-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.quickTech-faq-item {
  background: #ffffff;
  border: 1px solid #dceae5;
  border-radius: 14px;
  padding: 20px 24px;
}
.quickTech-faq-item h4 {
  font-size: 15px;
  margin-bottom: 8px;
  color: #21428a;
  font-family: "Inter", sans-serif;
  font-weight: 600;
}
.quickTech-faq-item p {
  font-size: 14px;
  color: #6b8079;
}

@media (max-width: 900px) {
  .quickTech-cards-grid {
    grid-template-columns: 1fr;
  }
  .quickTech-main-grid {
    grid-template-columns: 1fr;
  }
  .quickTech-form-row {
    grid-template-columns: 1fr;
  }
}

.quickTech-map-pin iframe {
  width: 100% !important;
}

/* contact */

/* blog */
.quicktech-blog-container h1,
.quicktech-blog-container h2,
.quicktech-blog-container h3,
.quicktech-blog-container h4 {
  color: #21428a;
  line-height: 1.2;
  font-weight: 600;
}

.quicktech-blog-container a {
  text-decoration: none;
  color: inherit;
}

.quicktech-blog-container img {
  max-width: 100%;
  display: block;
  width: 100%;
  height: 100%;
}

.quicktech-blog-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #21428a;
  margin-bottom: 14px;
}

.quicktech-blog-eyebrow::before {
  content: "";
  width: 20px;
  height: 2px;
  background: #ff6b4a;
  display: inline-block;
}

/* HERO */
.quicktech-blog-hero {
  background: #21428a12;
  padding: 80px 0 56px;
}
.quicktech-blog-hero h1 {
  font-size: clamp(32px, 4.5vw, 48px);
  max-width: 680px;
  margin-bottom: 16px;
}
.quicktech-blog-hero p {
  font-size: 17px;
  max-width: 560px;
  color: #3e524c;
}

/* SEARCH + CATEGORY BAR */
.quicktech-blog-filter-bar {
  background: #ffffff;
  border-bottom: 1px solid #dceae5;
  position: relative;
  top: -1px;
}
.quicktech-blog-filter-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 0;
  gap: 20px;
  flex-wrap: wrap;
}
.quicktech-blog-cats {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.quicktech-blog-cat {
  font-size: 13px;
  font-weight: 600;
  padding: 8px 16px;
  border-radius: 20px;
  border: 1px solid #dceae5;
  color: #6b8079;
}
.quicktech-blog-cat.quicktech-blog-active {
  background: #21428a;
  color: #fff;
  border-color: #21428a;
}
.quicktech-blog-search {
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid #dceae5;
  border-radius: 10px;
  padding: 10px 14px;
  min-width: 220px;
}
.quicktech-blog-search input {
  border: none;
  outline: none;
  font-size: 14px;
  width: 100%;
}

/* FEATURED */
.quicktech-blog-featured {
  padding: 56px 0 0;
}
.quicktech-blog-f-card {
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: #21428a;
  border-radius: 20px;
  overflow: hidden;
  min-height: 340px;
}
.quicktech-blog-f-img {
  background: linear-gradient(135deg, #21428a, #21428a);
  position: relative;
}
.quicktech-blog-f-img::before {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.04) 0 2px,
    transparent 2px 24px
  );
}
.quicktech-blog-f-body {
  padding: 40px;
  color: #21428a12;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.quicktech-blog-f-tag {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  color: #ff6b4a;
  background: rgba(255, 107, 74, 0.12);
  padding: 4px 12px;
  border-radius: 20px;
  margin-bottom: 16px;
  width: fit-content;
}
.quicktech-blog-f-body h2 {
  color: #fff;
  font-size: 26px;
  margin-bottom: 12px;
}
.quicktech-blog-f-body p {
  color: #b9d6cd;
  font-size: 15px;
  margin-bottom: 20px;
}
.quicktech-blog-f-meta {
  display: flex;
  gap: 16px;
  font-size: 13px;
  color: #8fbfb0;
}

/* GRID */
.quicktech-blog-posts {
  padding: 64px 0 96px;
}
.quicktech-blog-posts-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 36px;
}
.quicktech-blog-posts-head h2 {
  font-size: 26px;
}
.quicktech-blog-p-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 28px;
}
.quicktech-blog-p-card {
  border: 1px solid #dceae5;
  border-radius: 16px;
  overflow: hidden;
  transition:
    border-color 0.2s ease,
    transform 0.2s ease;
}
.quicktech-blog-p-card:hover {
  border-color: #21428a;
  transform: translateY(-4px);
}

.quicktech-blog-p-thumb {
  height: 160px;
  background: #21428a12;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #21428a;
  font-size: 15px;
  border-bottom: 1px solid #dceae5;
}

.quicktech-blog-p-body {
  padding: 22px;
}
.quicktech-blog-p-tag {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #c8471f;
  margin-bottom: 10px;
  display: block;
}
.quicktech-blog-p-card h3 {
  font-size: 17px;
  margin-bottom: 10px;
  color: black;
}
.quicktech-blog-p-card p {
  font-size: 14px;
  color: #6b8079;
  margin-bottom: 16px;
}
.quicktech-blog-p-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
  color: #6b8079;
  border-top: 1px solid #dceae5;
  padding-top: 14px;
}
.quicktech-blog-p-meta .quicktech-blog-author {
  display: flex;
  align-items: center;
  gap: 8px;
}
.quicktech-blog-avatar-sm {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #21428a;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
}

.quicktech-blog-load-more {
  display: block;
  margin: 48px auto 0;
  padding: 13px 32px;
  border-radius: 10px;
  border: 1.5px solid #21428a;
  color: #21428a;
  font-weight: 600;
  font-size: 14px;
  width: fit-content;
}
.quicktech-blog-load-more:hover {
  background: #21428a;
  color: #fff;
}

/* NEWSLETTER */
.quicktech-blog-newsletter {
  background: #21428a12;
  padding: 72px 0;
}
.quicktech-blog-n-box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 32px;
  flex-wrap: wrap;
}
.quicktech-blog-n-box h2 {
  font-size: 26px;
  max-width: 420px;
}
.quicktech-blog-n-box p {
  font-size: 14px;
  color: #6b8079;
  margin-top: 8px;
  max-width: 420px;
}
.quicktech-blog-n-form {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.quicktech-blog-n-form input {
  padding: 14px 16px;
  border-radius: 10px;
  border: 1px solid #dceae5;

  font-size: 14px;
  min-width: 240px;
}
.quicktech-blog-n-form button {
  padding: 14px 24px;
  border-radius: 10px;
  background: #ff6b4a;
  color: #fff;
  border: none;
  font-weight: 600;
  font-size: 14px;
}
.quicktech-blog-n-form button:hover {
  background: #c8471f;
}

@media (max-width: 900px) {
  .quicktech-blog-f-card {
    grid-template-columns: 1fr;
  }
  .quicktech-blog-f-img {
    height: 200px;
  }
  .quicktech-blog-p-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .quicktech-blog-filter-inner {
    flex-direction: column;
    align-items: flex-start;
  }
}
@media (max-width: 560px) {
  .quicktech-blog-p-grid {
    grid-template-columns: 1fr;
  }
  .quicktech-blog-n-box {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* blog */

/* appointment next */
.quicktech-ap-next-topbar {
  background: #0b3d3a;
  color: #fff;
  font-size: 13px;
  padding: 8px 24px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.quicktech-ap-next-container {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 20px;
}
header.quicktech-ap-next-page-head {
  background: linear-gradient(135deg, #21428a, #21428ad6);
  color: #fff;
  padding: 34px 20px 46px;
  text-align: center;
}
header.quicktech-ap-next-page-head h1 {
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 0.3px;
}
header.quicktech-ap-next-page-head p {
  margin-top: 6px;
  font-size: 14px;
  opacity: 0.9;
}

/* Step indicator */
.quicktech-ap-next-steps {
  max-width: 960px;
  margin: -28px auto 30px;
  padding: 0 20px;
  display: flex;
  justify-content: space-between;
  position: relative;
}
.quicktech-ap-next-steps::before {
  content: "";
  position: absolute;
  top: 19px;
  left: 44px;
  right: 44px;
  height: 2px;
  background: #21428a12;
  z-index: 0;
}
.quicktech-ap-next-step {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  flex: 1;
}
.quicktech-ap-next-step .quicktech-ap-next-dot {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid #21428a12;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 14px;
  color: #83948f;
  box-shadow: 0 8px 24px rgba(11, 61, 58, 0.08);
}
.quicktech-ap-next-step.quicktech-ap-next-done .quicktech-ap-next-dot {
  background: white;
  border-color: #21428a;
  color: black;
}
.quicktech-ap-next-step.quicktech-ap-next-active .quicktech-ap-next-dot {
  background: #21428a;
  border-color: #21428a;
  color: white;
  box-shadow: 0 0 0 4px #21428a12;
}
.quicktech-ap-next-step span.quicktech-ap-next-label {
  font-size: 11.5px;
  color: #83948f;
  text-align: center;
  max-width: 80px;
}
.quicktech-ap-next-step.quicktech-ap-next-active span.quicktech-ap-next-label,
.quicktech-ap-next-step.quicktech-ap-next-done span.quicktech-ap-next-label {
  color: #21428a;
  font-weight: 600;
}

/* Layout: form + quicktech-ap-next-summary */
.quicktech-ap-next-layout {
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  gap: 28px;
  align-items: start;
}
@media (max-width: 800px) {
  .quicktech-ap-next-layout {
    grid-template-columns: 1fr;
  }
}

.quicktech-ap-next-card {
  background: #fff;
  border: #21428a12;
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(11, 61, 58, 0.08);
  padding: 26px 24px;
}
.quicktech-ap-next-card h2 {
  font-size: 17px;
  color: #0b3d3a;
  margin-bottom: 4px;
}
.quicktech-ap-next-card .quicktech-ap-next-sub {
  font-size: 13px;
  color: #83948f;
  margin-bottom: 20px;
}

fieldset {
  border: none;
  margin-bottom: 22px;
}
fieldset legend {
  font-size: 13px;
  font-weight: 700;
  color: #21428a;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 12px;
  padding: 0;
}
.quicktech-ap-next-grid2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
@media (max-width: 520px) {
  .quicktech-ap-next-grid2 {
    grid-template-columns: 1fr;
  }
}

.quicktech-ap-next-field {
  margin-bottom: 16px;
}
.quicktech-ap-next-field label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: #122421;
  margin-bottom: 6px;
}
.quicktech-ap-next-field label .quicktech-ap-next-req {
  color: #d94f4f;
}
.quicktech-ap-next-field input,
.quicktech-ap-next-field select,
.quicktech-ap-next-field textarea {
  width: 100%;
  padding: 11px 13px;
  border: #21428a12;
  border-radius: 10px;
  font-size: 14px;
  color: #122421;
  background: #21428a12;
  outline: none;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
}
.quicktech-ap-next-field input:focus,
.quicktech-ap-next-field select:focus,
.quicktech-ap-next-field textarea:focus {
  border-color: #21428a12;
  box-shadow: 0 0 0 3px #21428a12;
  background: #fff;
}
.quicktech-ap-next-field textarea {
  resize: vertical;
  min-height: 80px;
}
.quicktech-ap-next-hint {
  font-size: 12px;
  color: #83948f;
  margin-top: 5px;
}

.quicktech-ap-next-radio-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.quicktech-ap-next-radio-chip {
  border: #21428a12;
  padding: 9px 16px;
  border-radius: 999px;
  font-size: 13px;
  cursor: pointer;
  color: #4d605c;
  background: #21428a12;
  transition: all 0.15s;
}
.quicktech-ap-next-radio-chip input {
  display: none;
}
.quicktech-ap-next-radio-chip.quicktech-ap-next-selected {
  background: #21428a;
  border-color: #21428a12;
  color: white;
  font-weight: 600;
}

.quicktech-ap-next-toggle-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  background: #21428a12;
  border: 1px dashed #21428a12;
  border-radius: 10px;
  margin-bottom: 14px;
  font-size: 13px;
  color: #4d605c;
}
.quicktech-ap-next-toggle-row input {
  margin-top: 3px;
}

.quicktech-ap-next-consent {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 12.5px;
  color: #4d605c;
  margin-top: 6px;
}
.quicktech-ap-next-consent input {
  margin-top: 3px;
}
.quicktech-ap-next-consent a {
  color: #21428a;
  font-weight: 600;
  text-decoration: none;
}

/* Summary quicktech-ap-next-card (sticky) */
.quicktech-ap-next-summary {
  position: sticky;
  top: 80px;
}
.quicktech-ap-next-summary .quicktech-ap-next-svc {
  display: flex;
  gap: 12px;
  align-items: center;
  padding-bottom: 16px;
  border-bottom: #21428a12;
  margin-bottom: 16px;
}
.quicktech-ap-next-summary .quicktech-ap-next-svc img {
  width: 52px;
  height: 52px;
  border-radius: 10px;
  object-fit: cover;
  background: #21428a12;
}
.quicktech-ap-next-summary .quicktech-ap-next-svc h3 {
  font-size: 15px;
  color: #122421;
}
.quicktech-ap-next-summary .quicktech-ap-next-svc p {
  font-size: 12px;
  color: #83948f;
}

.quicktech-ap-next-summary-row {
  display: flex;
  justify-content: space-between;
  font-size: 13.5px;
  padding: 8px 0;
  border-bottom: 1px dashed #21428a12;
  color: #4d605c;
}
.quicktech-ap-next-summary-row span:last-child {
  color: #122421;
  font-weight: 600;
  text-align: right;
}
.quicktech-ap-next-summary-row.quicktech-ap-next-total {
  border-bottom: none;
  padding-top: 14px;
  font-size: 15px;
}
.quicktech-ap-next-summary-row.quicktech-ap-next-total span:last-child {
  color: #21428a;
  font-size: 18px;
  font-weight: 800;
}

.quicktech-ap-next-edit-link {
  display: inline-block;
  font-size: 12px;
  color: #21428a;
  text-decoration: none;
  font-weight: 600;
  margin-top: 10px;
}

.quicktech-ap-next-note-box {
  margin-top: 18px;
  background: #fff7ea;
  border: 1px solid #f2ddac;
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 12.5px;
  color: #7a5a12;
  display: flex;
  gap: 8px;
}

/* Action buttons */
.quicktech-ap-next-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 28px;
  gap: 12px;
  flex-wrap: wrap;
}
.quicktech-ap-next-btn {
  border: none;
  border-radius: 10px;
  padding: 14px 26px;
  font-size: 14.5px;
  font-weight: 700;
  cursor: pointer;
  transition:
    transform 0.1s,
    box-shadow 0.15s,
    background 0.15s;
}
.quicktech-ap-next-btn-back {
  background: #fff;
  color: #4d605c;
  border: #21428a12;
}
.quicktech-ap-next-btn-back:hover {
  background: #21428a12;
}
.quicktech-ap-next-btn-primary {
  background: #21428a;
  color: #fff;
  box-shadow: 0 6px 18px rgba(18, 136, 111, 0.35);
}
.quicktech-ap-next-btn-primary:hover {
  background: #21428a;
  transform: translateY(-1px);
}
.quicktech-ap-next-btn-primary:disabled {
  background: #a9c9c2;
  box-shadow: none;
  cursor: not-allowed;
  transform: none;
}

.required-note {
  font-size: 12px;
  color: #83948f;
  margin-top: 6px;
}

/* appointment next */

/* appointment confirmation */

.quikctech-appointment-confirm-container {
  max-width: 960px;
  margin: 0 auto;
  padding: 0 20px;
}
header.quikctech-appointment-confirm-page-head {
  background: linear-gradient(135deg, #21428a, #21428ad6);
  color: #fff;
  padding: 34px 20px 46px;
  text-align: center;
}
header.quikctech-appointment-confirm-page-head h1 {
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 0.3px;
}
header.quikctech-appointment-confirm-page-head p {
  margin-top: 6px;
  font-size: 14px;
  opacity: 0.9;
}

/* Step indicator */
.quikctech-appointment-confirm-steps {
  max-width: 960px;
  margin: -28px auto 30px;
  padding: 0 20px;
  display: flex;
  justify-content: space-between;
  position: relative;
}
.quikctech-appointment-confirm-steps::before {
  content: "";
  position: absolute;
  top: 19px;
  left: 44px;
  right: 44px;
  height: 2px;
  background: #21428a12;
  z-index: 0;
}
.quikctech-appointment-confirm-step {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  flex: 1;
}
.quikctech-appointment-confirm-step .quikctech-appointment-confirm-dot {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #fff;
  border: 2px solid #21428a12;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 14px;
  color: #83948f;
  box-shadow: 0 8px 24px rgba(11, 61, 58, 0.08);
}
.quikctech-appointment-confirm-step.quikctech-appointment-confirm-done
  .quikctech-appointment-confirm-dot {
  background: white;
  border-color: #21428a;
  color: black;
}
.quikctech-appointment-confirm-step.quikctech-appointment-confirm-active
  .quikctech-appointment-confirm-dot {
  background: #21428a;
  border-color: #21428a;
  color: white;
  box-shadow: 0 0 0 4px #21428a12;
}
.quikctech-appointment-confirm-step span.quikctech-appointment-confirm-label {
  font-size: 11.5px;
  color: #83948f;
  text-align: center;
  max-width: 80px;
}
.quikctech-appointment-confirm-step.quikctech-appointment-confirm-active
  span.quikctech-appointment-confirm-label,
.quikctech-appointment-confirm-step.quikctech-appointment-confirm-done
  span.quikctech-appointment-confirm-label {
  color: #21428a;
  font-weight: 600;
}

/* Success banner */
.quikctech-appointment-confirm-success-card {
  background: #fff;
  border: 1px solid #21428a12;
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(11, 61, 58, 0.08);
  padding: 36px 28px;
  text-align: center;
  margin-bottom: 24px;
}
.quikctech-appointment-confirm-success-icon {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: #21428a12;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 18px;
  font-size: 36px;
  color: #21428a;
  animation: quikctech-appointment-confirm-pop 0.4s ease;
}
@keyframes quikctech-appointment-confirm-pop {
  0% {
    transform: scale(0.6);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
.quikctech-appointment-confirm-success-card h2 {
  font-size: 22px;
  color: #0b3d3a;
  margin-bottom: 8px;
}
.quikctech-appointment-confirm-success-card p {
  font-size: 14px;
  color: #4d605c;
  max-width: 480px;
  margin: 0 auto;
}
.quikctech-appointment-confirm-booking-id {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
  background: #21428a12;
  border: 1px dashed #21428a12;
  border-radius: 999px;
  padding: 9px 18px;
  font-size: 13.5px;
  color: #21428a;
  font-weight: 700;
  letter-spacing: 0.5px;
}
.quikctech-appointment-confirm-booking-id
  .quikctech-appointment-confirm-copy-btn {
  background: none;
  border: none;
  color: #21428a;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
}

/* Layout */
.quikctech-appointment-confirm-layout {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 24px;
  align-items: start;
}
@media (max-width: 800px) {
  .quikctech-appointment-confirm-layout {
    grid-template-columns: 1fr;
  }
}

.quikctech-appointment-confirm-card {
  background: #fff;
  border: 1px solid #21428a12;
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(11, 61, 58, 0.08);
  padding: 26px 24px;
  margin-bottom: 24px;
}
.quikctech-appointment-confirm-card h3 {
  font-size: 16px;
  color: #0b3d3a;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}

/* Appointment detail rows */
.quikctech-appointment-confirm-detail-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px dashed #21428a12;
  font-size: 13.5px;
}
.quikctech-appointment-confirm-detail-row:last-child {
  border-bottom: none;
}
.quikctech-appointment-confirm-detail-row
  .quikctech-appointment-confirm-detail-label {
  color: #83948f;
}
.quikctech-appointment-confirm-detail-row
  .quikctech-appointment-confirm-detail-value {
  color: #122421;
  font-weight: 600;
  text-align: right;
}

.quikctech-appointment-confirm-pro-card {
  display: flex;
  gap: 14px;
  align-items: center;
  padding: 14px;
  background: #21428a12;
  border-radius: 12px;
  margin-bottom: 16px;
}
.quicktech-ap-next-btn:hover {
  color: white;
}

.quikctech-appointment-confirm-pro-card img {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #fff;
  box-shadow: 0 8px 24px rgba(11, 61, 58, 0.08);
}
.quikctech-appointment-confirm-pro-card
  .quikctech-appointment-confirm-pro-name {
  font-size: 14.5px;
  font-weight: 700;
  color: #122421;
}
.quikctech-appointment-confirm-pro-card
  .quikctech-appointment-confirm-pro-role {
  font-size: 12.5px;
  color: #83948f;
}
.quikctech-appointment-confirm-pro-card
  .quikctech-appointment-confirm-pro-rating {
  font-size: 12px;
  color: black;
  margin-top: 2px;
}

.quikctech-appointment-confirm-address-box {
  display: flex;
  gap: 10px;
  padding: 14px;
  background: #21428a12;
  border-radius: 12px;
  font-size: 13.5px;
  color: #4d605c;
}

/* Timeline: what happens next */
.quikctech-appointment-confirm-timeline {
  list-style: none;
}
.quikctech-appointment-confirm-timeline-item {
  display: flex;
  gap: 14px;
  position: relative;
  padding-bottom: 22px;
}
.quikctech-appointment-confirm-timeline-item:last-child {
  padding-bottom: 0;
}
.quikctech-appointment-confirm-timeline-item::before {
  content: "";
  position: absolute;
  left: 13px;
  top: 28px;
  bottom: 0;
  width: 2px;
  background: #21428a12;
}
.quikctech-appointment-confirm-timeline-item:last-child::before {
  display: none;
}
.quikctech-appointment-confirm-timeline-marker {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #21428a12;
  color: #21428a;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 700;
  flex-shrink: 0;
}
.quikctech-appointment-confirm-timeline-item.quikctech-appointment-confirm-active-step
  .quikctech-appointment-confirm-timeline-marker {
  background: #21428a;
  color: #fff;
}
.quikctech-appointment-confirm-timeline-text h4 {
  font-size: 13.5px;
  color: #122421;
  margin-bottom: 3px;
}
.quikctech-appointment-confirm-timeline-text p {
  font-size: 12.5px;
  color: #83948f;
}

/* Payment summary */
.quikctech-appointment-confirm-summary-row {
  display: flex;
  justify-content: space-between;
  font-size: 13.5px;
  padding: 8px 0;
  border-bottom: 1px dashed #21428a12;
  color: #4d605c;
}
.quikctech-appointment-confirm-summary-row span:last-child {
  color: #122421;
  font-weight: 600;
}
.quikctech-appointment-confirm-summary-row.quikctech-appointment-confirm-total {
  border-bottom: none;
  padding-top: 14px;
  font-size: 15px;
}
.quikctech-appointment-confirm-summary-row.quikctech-appointment-confirm-total
  span:last-child {
  color: #21428a;
  font-size: 18px;
  font-weight: 800;
}

.quikctech-appointment-confirm-badge {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  background: #21428a12;
  color: #21428a;
}
.quikctech-appointment-confirm-badge.quikctech-appointment-confirm-pending {
  background: #fff2dc;
  color: #8a5a12;
}

.quikctech-appointment-confirm-note-box {
  margin-top: 6px;
  background: #fff7ea;
  border: 1px solid #f2ddac;
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 12.5px;
  color: #7a5a12;
  display: flex;
  gap: 8px;
}

/* Action buttons */
.quikctech-appointment-confirm-actions {
  display: flex;
  justify-content: center;
  gap: 14px;
  margin-top: 8px;
  flex-wrap: wrap;
}
.quikctech-appointment-confirm-btn {
  border: none;
  border-radius: 10px;
  padding: 14px 24px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition:
    transform 0.1s,
    box-shadow 0.15s,
    background 0.15s;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.quikctech-appointment-confirm-btn-outline {
  background: #fff;
  color: #21428a;
  border: 1px solid #21428a;
}
.quikctech-appointment-confirm-btn-outline:hover {
  background: #21428a12;
}
.quikctech-appointment-confirm-btn-primary {
  background: #21428a;
  color: #fff;
  box-shadow: 0 6px 18px rgba(18, 136, 111, 0.35);
}
.quikctech-appointment-confirm-btn-primary:hover {
  background: #21428a;
  transform: translateY(-1px);
}

.quikctech-appointment-confirm-share-row {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-top: 18px;
}
.quikctech-appointment-confirm-share-icon {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #21428a12;
  border: 1px solid #21428a12;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #21428a;
  cursor: pointer;
  font-size: 15px;
}
.quikctech-appointment-confirm-share-icon:hover {
  background: #21428a12;
}

.quikctech-appointment-confirm-help-line {
  text-align: center;
  font-size: 12.5px;
  color: #83948f;
  margin-top: 22px;
}
.quikctech-appointment-confirm-help-line a {
  color: #21428a;
  font-weight: 600;
  text-decoration: none;
}

.quicktech-ap-next-btn-back:hover {
  color: black;
}
/* appointment confirmation */

#quicktech-mobile-nav {
  display: none;
}

#quicktech-mobile-nav {
  background-color: #ffffff;
  box-shadow: 0 2px 15px rgba(0, 0, 0, 0.04);
  padding: 5px 0;
  position: sticky;
  top: 0;
  z-index: 99;
}

.quicktech-mob-left ul li a img {
  height: 25px;
}

.quicktech-mob-right ul li a img {
  height: 23px;
}

.quicktech-mob-right ul {
  display: flex;
  justify-content: space-around;
}

/* The main mobile search container */
.quikctech-mob-search {
  display: none; /* Hidden initially */
  position: relative; /* REQUIRED: Acts as the anchor for the absolute icon */
  margin-top: 10px; /* Pushes it below the original icon */
  width: 100%; /* Adjust width as needed for your mobile layout */
  max-width: 100%;
  padding-bottom: 5px;
}

/* Toggled via JavaScript to reveal the input */
.quikctech-mob-search.show {
  display: block;
}

/* Styled text input */
.search-input {
  width: 100%;
  padding: 5px 35px 5px 12px;
  border: 1px solid #ccc;
  border-radius: 20px;
  box-sizing: border-box;
  outline: none;
}

/* Absolute positioning for the inner icon */
.search-icon-inside {
  position: absolute; /* REQUIRED: Absolute positioning relative to .quikctech-mob-search */
  right: 10px;
  top: 50%;
  transform: translateY(-50%); /* Centers the icon perfectly vertically */
  cursor: pointer;
  display: flex;
  align-items: center;
}

/* Optional: Icon image sizing inside the input */
.search-icon-inside img {
  width: 16px;
  height: 16px;
  opacity: 0.6;
}

/* mobile nav */
/* Core Sidebar Styles styling */
.quicktech-mobilenav-sidebar {
  width: 320px !important; /* Perfect sweet-spot width for mobile viewports */
  background-color: #ffffff;
  box-shadow: 4px 0 24px rgba(0, 0, 0, 0.08);
}

.quicktech-mobilenav-sidebar .offcanvas-header {
  padding: 15px;
  background: #21428a12;
}
#quicktechMobileMenu {
  z-index: 99999999999;
}

/* Remove default list styles */
.quicktech-mobilenav-sidebar-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* Parent links layout */
.quicktech-mobilenav-sidebar-list .sidebar-link {
  display: block;
  padding: 15px 20px;
  color: #1f2937; /* Clean dark grey color */
  text-decoration: none;
  font-weight: 500;
  font-size: 16px;
  border-bottom: 1px solid #f3f4f6;
  transition: all 0.2s ease-in-out;
}

.quicktech-mobilenav-sidebar-list .sidebar-link:hover {
  background-color: #21428a;
  color: white; /* Primary Accent Blue color */
}

/* Smooth Chevron Rotate when opening main menu */
.quicktech-mobilenav-sidebar-list .sidebar-link .chevron-icon {
  font-size: 12px;
  transition: transform 0.3s ease;
}
.quicktech-mobilenav-sidebar-list .sidebar-link:not(.collapsed) .chevron-icon {
  transform: rotate(180deg);
  color: #2563eb;
}

/* Submenu container background */
.quicktech-mobilenav-sidebar.sidebar-submenu-box {
  background-color: #f8fafc;
  padding: 5px 0;
  border-bottom: 1px solid #e2e8f0;
}

/* Beautiful custom flex tiles for the inner services items */
.quicktech-mobilenav-sidebar .sidebar-submenu-item {
  display: flex;
  align-items: center;
  justify-content: space-between; /* Pushes chevron to the far right */
  padding: 12px 25px;
  text-decoration: none;
  color: #475569;
  font-size: 14px;
  font-weight: 500;
  transition: background-color 0.2s ease, color 0.2s ease;
}

.quicktech-mobilenav-sidebar .sidebar-submenu-item:hover,
.quicktech-mobilenav-sidebar .sidebar-submenu-item:not(.collapsed) {
  background-color: #21428a;
  color: white;
}

/* Group icon and text to stay on the left */
.quicktech-mobilenav-sidebar .submenu-item-left {
  display: flex;
  align-items: center;
}

/* Icon layout circles inside menu */
.quicktech-mobilenav-sidebar .dropdown-icon-box {
  width: 32px;
  height: 32px;
  background-color: #ffffff;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 12px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
}

.quicktech-mobilenav-sidebar .dropdown-icon-box i {
  font-size: 14px;
}

/* -------------------------------------
   CHILD MENU (Mobile Accordion) STYLES
   ------------------------------------- */

/* Submenu Chevron rotation (Secondary Level) */
.quicktech-mobilenav-sidebar .sidebar-submenu-item .submenu-chevron {
  font-size: 10px;
  transition: transform 0.3s ease;
}
.quicktech-mobilenav-sidebar .sidebar-submenu-item:not(.collapsed) .submenu-chevron {
  transform: rotate(180deg);
  color: white; /* Contrast against the dark blue active background */
}

/* Child menu container */
.quicktech-mobilenav-sidebar .sidebar-childmenu-box {
  background-color: #f1f5f9; /* Slightly darker to show depth/hierarchy */
  padding: 5px 0;
  border-left: 3px solid #21428a; /* Accent border to show it belongs to parent */
}

/* Child menu items */
.quicktech-mobilenav-sidebar .sidebar-childmenu-item {
  display: block;
  padding: 10px 25px 10px 65px; /* Deep left padding aligns text nicely with parent */
  text-decoration: none;
  color: #64748b;
  font-size: 13px;
  font-weight: 500;
  transition: background-color 0.2s ease, color 0.2s ease;
}

.quicktech-mobilenav-sidebar .sidebar-childmenu-item:hover {
  background-color: #e2e8f0;
  color: #0f172a;
}
/* mobile nav */

/* mobile bottom nav */

/* Floating Mobile Bottom Navbar Dock */
.quicktech-mob-bottom-nav {
  position: fixed;
  bottom: 8px;
  left: 15px;
  right: 15px;
  height: 60px;
  background-color: #eff2f7;
  border-radius: 33px;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
  display: flex;
  justify-content: space-around;
  align-items: center;
  z-index: 1060;
  border: 1px solid rgba(0, 0, 0, 0.03);
  padding: 0 10px;
  box-sizing: border-box;
}

/* Individual Tab Layout */
.quicktech-mob-bottom-nav .nav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  position: relative;
  width: 22%;
  height: 100%;
  transition: all 0.25s ease;
}

/* Container to handle the image sizing and cart badges */
.quicktech-mob-bottom-nav .icon-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 2px;
}

/* Image Icon Controller */
.quicktech-mob-bottom-nav .nav-img {
  width: 24px; /* Ideal standard size for mobile action buttons */
  height: 24px;
  object-fit: contain;

  transition: all 0.25s ease;
}

/* Text Label styling */
.quicktech-mob-bottom-nav .nav-label {
  font-size: 11px;
  font-weight: 600;
  color: black; /* Slate grey text color */
  transition: all 0.25s ease;
}

/* The Micro Active Indicator Dot hidden by default */
.quicktech-mob-bottom-nav .active-dot {
  position: absolute;
  bottom: 4px;
  width: 4px;
  height: 4px;
  background-color: #2563eb; /* Primary active accent color */
  border-radius: 50%;
  transform: scale(0);
  transition: transform 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* ==========================================================
   ACTIVE STATE CONTROLS (Applied dynamically or manually)
   ========================================================== */

/* Active Tab wrapper changes */
.quicktech-mob-bottom-nav .nav-item.active {
  transform: translateY(-2px); /* Subtle physical lift action */
}

/* Lights up the image to full color/visibility */
.quicktech-mob-bottom-nav .nav-item.active .nav-img {
  opacity: 1;
  transform: scale(1.05);
}

/* Updates text colors */
/* .quicktech-mob-bottom-nav .nav-item.active .nav-label {
  color: #2563eb; 
} */

/* Pops the bottom indicator dot into view */
.quicktech-mob-bottom-nav .nav-item.active .active-dot {
  transform: scale(1);
}

/* ==========================================================
   BADGE CONFIGURATION
   ========================================================== */
.quicktech-mob-bottom-nav .cart-badge {
  position: absolute;
  top: -6px;
  right: -8px;
  background-color: #ef4444;
  color: #ffffff;
  font-size: 10px;
  font-weight: 700;
  border-radius: 50%;
  min-width: 18px;
  height: 18px;
  padding: 0 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #ffffff;
  box-shadow: 0 2px 5px rgba(239, 68, 68, 0.3);
}

/* Responsive visibility breakpoint layout rules */
@media (min-width: 768px) {
  .quicktech-mob-bottom-nav {
    display: none !important;
  }
}

/* 1. Offcanvas Structural Core */
.quicktech-mob-product-category-wrapper.offcanvas {
  width: 319px;
  background-color: #f8fafc;
  border-left: none;
  box-shadow: -10px 0 40px rgba(15, 23, 42, 0.08);
  z-index: 999999999;
}

/* 2. Header Custom Layout */
.quicktech-mob-product-category-header {
  padding: 15px;
  background-color: #21428a12;
  border-bottom: 1px solid #f1f5f9;
}

.quicktech-mob-product-category-title {
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}

.quicktech-mob-product-category-close {
  background-color: #f1f5f9;
  border-radius: 50%;
  padding: 0.6rem;
  font-size: 0.75rem;
  opacity: 1;
  transition: all 0.2s ease;
}

.quicktech-mob-product-category-close:hover {
  background-color: #e2e8f0;
  transform: scale(1.05);
}

/* 3. Integrated Dynamic Search Area */
.quicktech-mob-product-category-search-box {
  padding: 1rem 1.5rem;
  background-color: #ffffff;
  border-bottom: 1px solid #e2e8f0;
}

.quicktech-mob-product-category-search-inner {
  position: relative;
}

.quicktech-mob-product-category-search-inner i {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: #94a3b8;
  font-size: 0.95rem;
}

.quicktech-mob-product-category-search-input {
  width: 100%;
  padding: 0.65rem 1rem 0.65rem 2.5rem;
  background-color: #f1f5f9;
  border: 1px solid transparent;
  border-radius: 12px;
  font-size: 0.9rem;
  color: #0f172a;
  transition: all 0.2s ease;
}

.quicktech-mob-product-category-search-input:focus {
  background-color: #ffffff;
  border-color: #21428a;
  outline: none;
  box-shadow: 0 0 0 4px rgba(0, 166, 118, 0.1);
}

/* 4. Scrollable Container Configuration */
.quicktech-mob-product-category-body {
  padding: 1.25rem 0 !important;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow-y: auto;
}

.quicktech-mob-product-category-body::-webkit-scrollbar {
  width: 4px;
}
.quicktech-mob-product-category-body::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 10px;
}

/* 5. Modern Card List Items */
.quicktech-mob-product-category-list {
  list-style: none;
  padding: 0;
  margin: 0 0 1.5rem 0;
}

.quicktech-mob-product-category-item {
  margin: 0.4rem 1.25rem;
}

.quicktech-mob-product-category-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #334155;
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
  padding: 7px 11px;
  border-radius: 14px;
  background-color: #ffffff;
  border: 1px solid rgba(241, 245, 249, 0.8);
  box-shadow: 0 2px 4px rgba(15, 23, 42, 0.015);
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Left side details wrapper */
.quicktech-mob-product-category-link-left {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 12px;
}

/* Premium Icon Color Containers */
.quicktech-mob-product-category-icon-box {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  transition: all 0.2s ease;

  /* Default color profiles */
  background-color: #f1f5f9;
  color: #64748b;
}

/* Right utilities (badge + chevron) */
.quicktech-mob-product-category-link-right {
  display: flex;
  align-items: center;
  gap: 8px;
}

.quicktech-mob-product-category-count-badge {
  font-size: 0.75rem;
  font-weight: 500;
  color: #94a3b8;
  background-color: #f8fafc;
  padding: 2px 8px;
  border-radius: 20px;
  border: 1px solid #e2e8f0;
}

.quicktech-mob-product-category-chevron {
  font-size: 0.75rem;
  color: #cbd5e1;
  transition: transform 0.2s ease;
}

/* 6. Dynamic Hover and Active States */
.quicktech-mob-product-category-link:hover {
  color: #21428a;
  background-color: #ffffff;
  border-color: rgba(0, 166, 118, 0.25);
  box-shadow: 0 4px 12px rgba(0, 166, 118, 0.05);
}

.quicktech-mob-product-category-link:hover
  .quicktech-mob-product-category-icon-box {
  background-color: #21428a12;
  color: #21428a;
  transform: scale(1.05);
}

.quicktech-mob-product-category-link:hover
  .quicktech-mob-product-category-chevron {
  color: #21428a;
  transform: translateX(2px);
}

/* Fully Active Item State styling */
.quicktech-mob-product-category-link.active {
  color: #21428a;
  background-color: #21428a12;
  border-color: rgba(0, 166, 118, 0.15);
}
.quicktech-mob-product-category-link.active
  .quicktech-mob-product-category-icon-box {
  background-color: #21428a;
  color: #ffffff;
}
.quicktech-mob-product-category-link.active
  .quicktech-mob-product-category-count-badge {
  background-color: rgba(0, 166, 118, 0.1);
  color: #21428a;
  border-color: transparent;
}
.quicktech-mob-product-category-link.active
  .quicktech-mob-product-category-chevron {
  color: #21428a;
}

/* 7. Enhanced Professional Care Support Banner */
.quicktech-mob-product-category-banner {
  position: relative;
  background: linear-gradient(135deg, #0d9488 0%, #115e59 100%);
  margin: auto 1.25rem 0.5rem 1.25rem;
  padding: 1.5rem;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 12px 24px rgba(13, 148, 136, 0.2);
}

.quicktech-mob-product-category-banner-content {
  position: relative;
  z-index: 2;
  max-width: 62%;
}

.quicktech-mob-product-category-banner-title {
  color: #ffffff;
  font-size: 1.15rem;
  font-weight: 700;
  margin-bottom: 0.3rem;
}

.quicktech-mob-product-category-banner-text {
  color: rgba(255, 255, 255, 0.85);
  font-size: 0.8rem;
  line-height: 1.4;
  margin-bottom: 1.2rem;
}

/* WhatsApp Button Layout inside frame */
.quicktech-product-sidebar-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background-color: #25d366;
  color: #ffffff;
  font-size: 0.8rem;
  font-weight: 700;
  text-decoration: none;
  padding: 0.6rem 1.1rem;
  border-radius: 10px;
  box-shadow: 0 4px 12px rgba(37, 211, 102, 0.3);
  transition: all 0.2s ease;
}

.quicktech-product-sidebar-btn:hover {
  background-color: #1fba55;
  color: #ffffff;
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(37, 211, 102, 0.4);
}

.quicktech-mob-product-category-banner-img {
  position: absolute;
  right: -8px;
  bottom: -4px;
  height: 110%;
  width: auto;
  object-fit: contain;
  z-index: 1;
  pointer-events: none;
  filter: drop-shadow(-4px 4px 10px rgba(15, 23, 42, 0.25));
}

/* Trigger Nav Helper for Demo layout mapping */
.demo-trigger-btn {
  padding: 0.75rem 1.5rem;
  background-color: #21428a;
  color: #ffffff;
  font-weight: 600;
  border: none;
  border-radius: 12px;
  box-shadow: 0 4px 14px rgba(0, 166, 118, 0.25);
  transition: all 0.2s ease;
}
.demo-trigger-btn:hover {
  background-color: #008f64;
  transform: translateY(-1px);
}
/* mobile bottom nav */

/* cart */

.quickTech-breadcrumb {
  font-size: 13px;
  color: #6b7a75;
  margin-bottom: 18px;
}
.quickTech-breadcrumb a:hover {
  color: #21428a;
}
.quickTech-breadcrumb span {
  margin: 0 6px;
}
.quickTech-breadcrumb .quickTech-breadcrumb-current {
  color: #16211d;
  font-weight: 600;
}

/* ------------------------------------------------------------
   Page header
------------------------------------------------------------- */
.quickTech-cart-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 20px;
}
.quickTech-cart-title {
  font-size: 28px;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 10px;
}
.quickTech-cart-title .quickTech-cart-count {
  font-family: "Inter", sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: #21428a;
  background: #21428a12;
  padding: 4px 12px;
  border-radius: 999px;
}
.quickTech-continue-shopping {
  font-size: 14px;
  font-weight: 600;
  color: #21428a;
  display: flex;
  align-items: center;
  gap: 6px;
}
.quickTech-continue-shopping:hover {
  color: #21428a;
}

/* ------------------------------------------------------------
   Category filter tabs — All Items / Medicine / Cosmetics
   Needed because the store sells both product families and
   each has a different set of relevant fields (Rx vs Shade etc.)
------------------------------------------------------------- */
.quickTech-category-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.quickTech-category-tab {
  border: 1px solid #e3eae7;
  background: #ffffff;
  color: #6b7a75;
  font-size: 13px;
  font-weight: 600;
  padding: 8px 16px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: all 0.15s ease;
}
.quickTech-category-tab:hover {
  border-color: #21428a;
  color: #21428a;
}
.quickTech-category-tab.quickTech-tab-active {
  background: #16211d;
  border-color: #16211d;
  color: #fff;
}
.quickTech-category-tab .quickTech-tab-count {
  font-size: 11px;
  opacity: 0.75;
}

/* ------------------------------------------------------------
   Signature element: Free Delivery Meter
   Ties directly into the site's delivery-fee logic
   (৳60 fee, waived above ৳500 — shown on product page)
------------------------------------------------------------- */
.quickTech-delivery-meter {
  background: #ffffff;
  border: 1px solid #e3eae7;
  border-radius: 14px;
  padding: 16px 20px;
  margin-bottom: 20px;
  box-shadow: 0 4px 20px rgba(14, 159, 110, 0.08);
}
.quickTech-delivery-meter-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
  font-size: 13.5px;
}
.quickTech-delivery-meter-msg {
  font-weight: 600;
}
.quickTech-delivery-meter-msg .quickTech-amt {
  color: #21428a;
}
.quickTech-delivery-meter-msg.quickTech-unlocked {
  color: #21428a;
}
.quickTech-meter-track {
  width: 100%;
  height: 8px;
  background: #21428a12;
  border-radius: 999px;
  overflow: hidden;
}
.quickTech-meter-fill {
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, #21428a, #21428a);
  border-radius: 999px;
  transition: width 0.4s ease;
}
.quickTech-meter-fill.quickTech-meter-complete {
  background: linear-gradient(90deg, #21428a, #0cb7b5);
}

/* ------------------------------------------------------------
   Layout: items (left) + summary (right)
------------------------------------------------------------- */
.quickTech-cart-layout {
  display: grid;
  grid-template-columns: 1fr 360px;
  gap: 24px;
  align-items: flex-start;
}

/* ------------------------------------------------------------
   Cart item card
------------------------------------------------------------- */
.quickTech-cart-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.quickTech-cart-item {
  background: #ffffff;
  border: 1px solid #e3eae7;
  border-radius: 14px;
  padding: 18px;
  display: grid;
  grid-template-columns: 88px 1fr;
  gap: 16px;
  position: relative;
  transition: box-shadow 0.2s ease;
}

.quickTech-cart-item:hover {
  box-shadow: 0 4px 20px rgba(14, 159, 110, 0.08);
}

.quickTech-item-thumb {
  width: 88px;
  height: 88px;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #e3eae7;
  background: #fafcfb;
}
.quickTech-item-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.quickTech-item-main {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}

.quickTech-item-top-row {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.quickTech-item-name {
  font-family: "Sora", sans-serif;
  font-size: 16.5px;
  font-weight: 600;
  margin-bottom: 2px;
}
.quickTech-item-meta {
  font-size: 12.5px;
  color: #6b7a75;
  line-height: 1.5;
}
.quickTech-item-meta b {
  color: #16211d;
  font-weight: 600;
}

.quickTech-item-tags {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 2px;
}
.quickTech-tag {
  font-size: 11px;
  font-weight: 600;
  padding: 3px 9px;
  border-radius: 999px;
  background: #f1f5f3;
  color: #6b7a75;
}
.quickTech-tag-rx {
  background: #fff3ec;
  color: #ff6b4a;
}
.quickTech-tag-stock {
  background: #21428a12;
  color: #21428a;
}
.quickTech-tag-medicine {
  background: #21428a12;
  color: #21428a;
}
.quickTech-tag-cosmetic {
  background: #fceaf3;
  color: #c2478a;
}

.quickTech-remove-btn {
  border: none;
  background: transparent;
  color: #6b7a75;
  font-size: 13px;
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 4px;
  border-radius: 6px;
  height: fit-content;
  white-space: nowrap;
}
.quickTech-remove-btn:hover {
  color: #e23e3e;
  background: #fdeded;
}
.quickTech-remove-btn svg {
  width: 15px;
  height: 15px;
}

/* Rx prescription notice inline in cart item */
.quickTech-rx-notice {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  background: #fff9f0;
  border: 1px dashed #f0c989;
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 12.5px;
  color: #9a6a17;
}
.quickTech-rx-notice.quickTech-rx-verified {
  background: #21428a12;
  border: 1px solid #b7e4d3;
  color: #21428a;
}
.quickTech-rx-upload-btn {
  border: 1px solid #ff6b4a;
  color: #ff6b4a;
  background: #fff;
  font-size: 11.5px;
  font-weight: 700;
  padding: 5px 10px;
  border-radius: 6px;
  white-space: nowrap;
}
.quickTech-rx-upload-btn:hover {
  background: #ff6b4a;
  color: #fff;
}

.quickTech-item-bottom-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 2px;
}

.quickTech-item-price {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.quickTech-price-now {
  font-family: "Sora", sans-serif;
  font-size: 17px;
  font-weight: 700;
  color: #21428a;
}
.quickTech-price-old {
  font-size: 12.5px;
  color: #6b7a75;
  text-decoration: line-through;
}
.quickTech-price-save {
  font-size: 11.5px;
  font-weight: 700;
  color: #ff6b4a;
}

/* Quantity stepper */
.quickTech-qty-stepper {
  display: flex;
  align-items: center;
  border: 1px solid #e3eae7;
  border-radius: 999px;
  overflow: hidden;
  height: 34px;
}
.quickTech-qty-btn {
  width: 34px;
  height: 34px;
  border: none;
  background: #21428a12;
  color: #21428a;
  font-size: 16px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.quickTech-qty-btn:hover {
  background: #21428a;
  color: #fff;
}
.quickTech-qty-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.quickTech-qty-input {
  width: 42px;
  height: 100%;
  text-align: center;
  border: none;
  font-weight: 700;
  font-size: 14px;
  color: #16211d;
  -moz-appearance: textfield;
}
.quickTech-qty-input::-webkit-outer-spin-button,
.quickTech-qty-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.quickTech-line-subtotal {
  font-size: 12.5px;
  color: #6b7a75;
  min-width: 110px;
  text-align: right;
}
.quickTech-line-subtotal b {
  display: block;
  font-family: "Sora", sans-serif;
  font-size: 15px;
  color: #16211d;
  font-weight: 700;
}

/* ------------------------------------------------------------
   Save-for-later strip (optional secondary action)
------------------------------------------------------------- */
.quickTech-save-later-btn {
  border: none;
  background: transparent;
  font-size: 12px;
  color: #6b7a75;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 0;
}
.quickTech-save-later-btn:hover {
  color: #21428a;
}
.quickTech-save-later-btn svg {
  width: 14px;
  height: 14px;
}

/* ------------------------------------------------------------
   Empty cart state
------------------------------------------------------------- */
.quickTech-cart-empty {
  background: #ffffff;
  border: 1px solid #e3eae7;
  border-radius: 20px;
  padding: 60px 24px;
  text-align: center;
  display: none;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}
.quickTech-cart-empty.quickTech-active {
  display: flex;
}
.quickTech-cart-empty svg {
  width: 64px;
  height: 64px;
  color: #21428a;
  opacity: 0.5;
}
.quickTech-cart-empty h3 {
  font-size: 20px;
}
.quickTech-cart-empty p {
  color: #6b7a75;
  font-size: 14px;
  max-width: 340px;
}
.quickTech-empty-shop-btn {
  margin-top: 6px;
  background: #21428a;
  color: #fff;
  padding: 12px 28px;
  border-radius: 999px;
  font-weight: 700;
  font-size: 14px;
  border: none;
}
.quickTech-empty-shop-btn:hover {
  background: #21428a;
}

/* ------------------------------------------------------------
   Order summary (right column, sticky)
------------------------------------------------------------- */
.quickTech-order-summary {
  background: #ffffff;
  border: 1px solid #e3eae7;
  border-radius: 20px;
  padding: 22px;
  /* position:sticky;
  top:20px; */
  box-shadow: 0 4px 20px rgba(14, 159, 110, 0.08);
}
.quickTech-summary-title {
  font-size: 17px;
  font-weight: 700;
  margin-bottom: 16px;
}

/* Promo code */
.quickTech-promo-box {
  display: flex;
  gap: 8px;
  margin-bottom: 18px;
}
.quickTech-promo-input {
  flex: 1;
  border: 1px solid #e3eae7;
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 13px;
  min-width: 0;
}
.quickTech-promo-input:focus {
  outline: 2px solid #21428a;
  outline-offset: 1px;
}
.quickTech-promo-apply-btn {
  border: none;
  background: #16211d;
  color: #fff;
  padding: 0 16px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}
.quickTech-promo-apply-btn:hover {
  background: #21428a;
}
.quickTech-promo-msg {
  font-size: 12px;
  margin: -10px 0 14px;
  min-height: 14px;
}
.quickTech-promo-msg.quickTech-success {
  color: #21428a;
}
.quickTech-promo-msg.quickTech-error {
  color: #e23e3e;
}

.quickTech-category-breakdown {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
}
.quickTech-category-chip {
  flex: 1;
  border: 1px solid #e3eae7;
  border-radius: 8px;
  padding: 9px 10px;
  font-size: 11.5px;
  color: #6b7a75;
}
.quickTech-category-chip b {
  display: block;
  font-family: "Sora", sans-serif;
  font-size: 14px;
  color: #16211d;
  font-weight: 700;
  margin-top: 2px;
}
.quickTech-category-chip.quickTech-chip-medicine {
  border-color: #cdebdf;
  background: #21428a12;
}
.quickTech-category-chip.quickTech-chip-medicine b {
  color: #21428a;
}
.quickTech-category-chip.quickTech-chip-cosmetic {
  border-color: #f3d3e4;
  background: #fceaf3;
}
.quickTech-category-chip.quickTech-chip-cosmetic b {
  color: #c2478a;
}

.quickTech-summary-rows {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-bottom: 14px;
  border-bottom: 1px dashed #e3eae7;
  margin-bottom: 14px;
}
.quickTech-summary-row {
  display: flex;
  justify-content: space-between;
  font-size: 13.5px;
  color: #6b7a75;
}
.quickTech-summary-row span:last-child {
  color: #16211d;
  font-weight: 600;
}
.quickTech-summary-row.quickTech-discount span:last-child {
  color: #ff6b4a;
}
.quickTech-summary-row.quickTech-delivery span:last-child.quickTech-free {
  color: #21428a;
}

.quickTech-summary-total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 18px;
}
.quickTech-summary-total span:first-child {
  font-family: "Sora", sans-serif;
  font-weight: 700;
  font-size: 15px;
}
.quickTech-summary-total span:last-child {
  font-family: "Sora", sans-serif;
  font-weight: 800;
  font-size: 22px;
  color: #21428a;
}

/* Delivery option selector */
.quickTech-delivery-options {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 18px;
}
.quickTech-delivery-option {
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid #e3eae7;
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 13px;
  cursor: pointer;
}
.quickTech-delivery-option:has(input:checked) {
  border-color: #21428a;
  background: #21428a12;
}
.quickTech-delivery-option input {
  accent-color: #21428a;
}
.quickTech-delivery-option .quickTech-do-label {
  font-weight: 600;
  flex: 1;
}
.quickTech-delivery-option .quickTech-do-sub {
  color: #6b7a75;
  font-size: 11.5px;
  display: block;
  font-weight: 400;
}
.quickTech-delivery-option .quickTech-do-price {
  font-weight: 700;
  color: #21428a;
}

/* Checkout button */
.quickTech-checkout-btn {
  width: 100%;
  background: #21428a;
  color: #fff;
  border: none;
  padding: 15px;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 14px;
  box-shadow: 0 6px 18px rgba(14, 159, 110, 0.28);
}
.quickTech-checkout-btn:hover {
  background: #0cb7b5;
}
.quickTech-checkout-btn:disabled {
  background: #c9d3d0;
  box-shadow: none;
  cursor: not-allowed;
}
.quickTech-checkout-btn svg {
  width: 18px;
  height: 18px;
}

.quickTech-cod-note {
  text-align: center;
  font-size: 12px;
  color: #6b7a75;
  margin-bottom: 16px;
}

/* Trust badges */
.quickTech-trust-badges {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-top: 14px;
  border-top: 1px solid #e3eae7;
}
.quickTech-trust-badge {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  color: #6b7a75;
}
.quickTech-trust-badge svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  color: #21428a;
}

/* ------------------------------------------------------------
   You may also like
------------------------------------------------------------- */
.quickTech-you-may-like {
  margin-top: 36px;
}
.quickTech-section-title {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 16px;
}
.quickTech-suggest-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.quickTech-suggest-card {
  background: #ffffff;
  border: 1px solid #e3eae7;
  border-radius: 14px;
  padding: 14px;
  transition:
    box-shadow 0.2s ease,
    transform 0.2s ease;
}
.quickTech-suggest-card:hover {
  box-shadow: 0 8px 28px rgba(14, 159, 110, 0.14);
  transform: translateY(-2px);
}
.quickTech-suggest-thumb {
  width: 100%;
  aspect-ratio: 1/1;
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 10px;
  background: #fafcfb;
  border: 1px solid #e3eae7;
}
.quickTech-suggest-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.quickTech-suggest-name {
  font-size: 13.5px;
  font-weight: 600;
  margin-bottom: 4px;
}
.quickTech-suggest-form {
  font-size: 11.5px;
  color: #6b7a75;
  margin-bottom: 8px;
}
.quickTech-suggest-price {
  font-size: 14px;
  font-weight: 700;
  color: #21428a;
  margin-bottom: 10px;
}
.quickTech-suggest-add-btn {
  width: 100%;
  border: 1px solid #21428a;
  color: #21428a;
  background: #fff;
  padding: 8px;
  border-radius: 8px;
  font-size: 12.5px;
  font-weight: 700;
}
.quickTech-suggest-add-btn:hover {
  background: #21428a;
  color: #fff;
}

/* ------------------------------------------------------------
   Mobile sticky checkout bar
------------------------------------------------------------- */
.quickTech-mobile-checkout-bar {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: #ffffff;
  border-top: 1px solid #e3eae7;
  padding: 12px 16px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  z-index: 40;
  box-shadow: 0 -6px 20px rgba(0, 0, 0, 0.06);
}
.quickTech-mobile-checkout-bar .quickTech-mcb-total b {
  display: block;
  font-family: "Sora", sans-serif;
  font-size: 18px;
  color: #21428a;
}
.quickTech-mobile-checkout-bar .quickTech-mcb-total span {
  font-size: 11px;
  color: #6b7a75;
}
.quickTech-mobile-checkout-bar .quickTech-checkout-btn {
  width: auto;
  padding: 12px 24px;
  margin: 0;
}

/* ------------------------------------------------------------
   Responsive
------------------------------------------------------------- */
@media (max-width: 980px) {
  .quickTech-cart-layout {
    grid-template-columns: 1fr;
  }
  .quickTech-order-summary {
    position: static;
  }
  .quickTech-suggest-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .quickTech-cart-item {
    grid-template-columns: 64px 1fr;
    padding: 14px;
  }
  .quickTech-item-thumb {
    width: 64px;
    height: 64px;
  }
  .quickTech-item-name {
    font-size: 14.5px;
  }
  .quickTech-item-bottom-row {
    flex-direction: column;
    align-items: flex-start;
  }
  .quickTech-line-subtotal {
    text-align: left;
  }
  .quickTech-cart-page {
    padding-bottom: 90px;
  }
  .quickTech-mobile-checkout-bar {
    display: flex;
  }
  .quickTech-order-summary .quickTech-checkout-btn {
    display: none;
  }
}

/* cart */

/* checkout */
.quicktech-checkout a {
  text-decoration: none;
  color: inherit;
}
.quicktech-checkout button {
  font-family: inherit;
  cursor: pointer;
}
.quicktech-checkout input,
.quicktech-checkout select,
.quicktech-checkout textarea {
  font-family: inherit;
}

.quicktech-checkout-breadcrumb {
  font-size: 13px;
  color: #6b7a75;
  margin-bottom: 18px;
}
.quicktech-checkout-breadcrumb a:hover {
  color: #21428a;
}
.quicktech-checkout-breadcrumb span {
  margin: 0 6px;
}
.quicktech-checkout-breadcrumb .quicktech-checkout-breadcrumb-current {
  color: #16211d;
  font-weight: 600;
}

.quicktech-checkout-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 20px;
}
.quicktech-checkout-title {
  font-size: 28px;
  font-weight: 700;
}
.quicktech-checkout-back-to-cart {
  font-size: 14px;
  font-weight: 600;
  color: #21428a;
  display: flex;
  align-items: center;
  gap: 6px;
}
.quicktech-checkout-back-to-cart:hover {
  color: #21428a;
}

.quicktech-checkout-steps {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}
.quicktech-checkout-step {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: #6b7a75;
}
.quicktech-checkout-step-num {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #e3eae7;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12.5px;
  font-family: "Sora", sans-serif;
}
.quicktech-checkout-step.quicktech-checkout-step-done
  .quicktech-checkout-step-num {
  background: #21428a;
}
.quicktech-checkout-step.quicktech-checkout-step-done {
  color: #21428a;
}
.quicktech-checkout-step.quicktech-checkout-step-active
  .quicktech-checkout-step-num {
  background: #16211d;
}
.quicktech-checkout-step.quicktech-checkout-step-active {
  color: #16211d;
}
.quicktech-checkout-step-divider {
  width: 28px;
  height: 1px;
  background: #e3eae7;
}

.quicktech-checkout-layout {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 24px;
  align-items: flex-start;
}

.quicktech-checkout-section-card {
  background: #ffffff;
  border: 1px solid #e3eae7;
  border-radius: 14px;
  padding: 20px 22px;
  margin-bottom: 18px;
}
.quicktech-checkout-section-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}
.quicktech-checkout-section-head .quicktech-checkout-section-icon {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #21428a12;
  color: #21428a;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.quicktech-checkout-section-head .quicktech-checkout-section-icon svg {
  width: 17px;
  height: 17px;
}
.quicktech-checkout-section-head h2 {
  font-size: 16.5px;
  font-weight: 700;
}
.quicktech-checkout-section-head .quicktech-checkout-section-sub {
  font-size: 12px;
  color: #6b7a75;
  margin-top: 2px;
  font-family: "Inter", sans-serif;
}

.quicktech-checkout-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.quicktech-checkout-form-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.quicktech-checkout-form-field.quicktech-checkout-span-2 {
  grid-column: span 2;
}
.quicktech-checkout-form-field label {
  font-size: 12.5px;
  font-weight: 600;
  color: #6b7a75;
}
.quicktech-checkout-form-field label .quicktech-checkout-required {
  color: #e23e3e;
}
.quicktech-checkout-form-field input,
.quicktech-checkout-form-field select,
.quicktech-checkout-form-field textarea {
  border: 1px solid #e3eae7;
  border-radius: 8px;
  padding: 11px 13px;
  font-size: 13.5px;
  color: #16211d;
  background: #ffffff;
  width: 100%;
}
.quicktech-checkout-form-field textarea {
  resize: vertical;
  min-height: 70px;
}
.quicktech-checkout-form-field input:focus,
.quicktech-checkout-form-field select:focus,
.quicktech-checkout-form-field textarea:focus {
  outline: 2px solid #21428a;
  outline-offset: 1px;
  border-color: #21428a;
}
.quicktech-checkout-form-field input::placeholder,
.quicktech-checkout-form-field textarea::placeholder {
  color: #9baaa5;
}

.quicktech-checkout-address-type-row {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
}
.quicktech-checkout-address-type-chip {
  border: 1px solid #e3eae7;
  background: #ffffff;
  color: #6b7a75;
  font-size: 13px;
  font-weight: 600;
  padding: 8px 16px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.quicktech-checkout-address-type-chip:hover {
  border-color: #21428a;
  color: #21428a;
}
.quicktech-checkout-address-type-chip.quicktech-checkout-chip-active {
  background: #21428a12;
  border-color: #21428a;
  color: #21428a;
}

.quicktech-checkout-delivery-card-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.quicktech-checkout-delivery-card {
  display: flex;
  align-items: center;
  gap: 12px;
  border: 1px solid #e3eae7;
  border-radius: 8px;
  padding: 12px 14px;
  cursor: pointer;
  transition: all 0.15s ease;
}
.quicktech-checkout-delivery-card:has(input:checked) {
  border-color: #21428a;
  background: #21428a12;
}
.quicktech-checkout-delivery-card input {
  accent-color: #21428a;
  width: 17px;
  height: 17px;
  flex-shrink: 0;
}
.quicktech-checkout-delivery-card .quicktech-checkout-dc-icon {
  font-size: 20px;
}
.quicktech-checkout-delivery-card .quicktech-checkout-dc-body {
  flex: 1;
}
.quicktech-checkout-delivery-card .quicktech-checkout-dc-label {
  font-weight: 700;
  font-size: 13.5px;
}
.quicktech-checkout-delivery-card .quicktech-checkout-dc-sub {
  font-size: 12px;
  color: #6b7a75;
  margin-top: 1px;
}
.quicktech-checkout-delivery-card .quicktech-checkout-dc-price {
  font-weight: 700;
  color: #21428a;
  font-size: 14px;
  white-space: nowrap;
}

.quicktech-checkout-payment-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.quicktech-checkout-payment-card {
  border: 1px solid #e3eae7;
  border-radius: 8px;
  padding: 14px;
  cursor: pointer;
  transition: all 0.15s ease;
}
.quicktech-checkout-payment-card:has(input:checked) {
  border-color: #21428a;
  background: #21428a12;
}
.quicktech-checkout-payment-card-top {
  display: flex;
  align-items: center;
  gap: 12px;
}
.quicktech-checkout-payment-card input {
  accent-color: #21428a;

  height: 38px;
  flex-shrink: 0;
}
.quicktech-checkout-payment-card .quicktech-checkout-pc-icon {
  width: 38px;
  height: 38px;
  border-radius: 8px;
  background: #fff;
  border: 1px solid #e3eae7;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  flex-shrink: 0;
}
.quicktech-checkout-payment-card .quicktech-checkout-pc-body {
  flex: 1;
}
.quicktech-checkout-payment-card .quicktech-checkout-pc-label {
  font-weight: 700;
  font-size: 13.5px;
}
.quicktech-checkout-payment-card .quicktech-checkout-pc-sub {
  font-size: 12px;
  color: #6b7a75;
  margin-top: 1px;
}
.quicktech-checkout-payment-card .quicktech-checkout-pc-badge {
  font-size: 10.5px;
  font-weight: 700;
  color: #21428a;
  background: #21428a12;
  padding: 3px 9px;
  border-radius: 999px;
}
.quicktech-checkout-payment-extra {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed #e3eae7;
  display: none;
}
.quicktech-checkout-payment-card.quicktech-checkout-pc-open
  .quicktech-checkout-payment-extra {
  display: block;
}
.quicktech-checkout-payment-extra .quicktech-checkout-form-grid {
  grid-template-columns: 1fr 1fr;
}

.quicktech-checkout-order-notes textarea {
  width: 100%;
  padding: 13px;
  border-radius: 9px;
  border: 1px solid #ddd;
}

.quicktech-checkout-order-summary {
  background: #ffffff;
  border: 1px solid #e3eae7;
  border-radius: 20px;
  padding: 22px;
  /* position: sticky;
        top: 20px; */
  box-shadow: 0 4px 20px rgba(14, 159, 110, 0.08);
}
.quicktech-checkout-summary-title {
  font-size: 17px;
  font-weight: 700;
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.quicktech-checkout-summary-title .quicktech-checkout-edit-cart-link {
  font-family: "Inter", sans-serif;
  font-size: 12.5px;
  font-weight: 600;
  color: #21428a;
}
.quicktech-checkout-summary-title .quicktech-checkout-edit-cart-link:hover {
  color: #21428a;
}

.quicktech-checkout-review-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-height: 280px;
  overflow-y: auto;
  padding-bottom: 14px;
  margin-bottom: 14px;
  border-bottom: 1px dashed #e3eae7;
}
.quicktech-checkout-review-item {
  display: grid;
  grid-template-columns: 52px 1fr auto;
  gap: 10px;
  align-items: center;
}
.quicktech-checkout-review-thumb {
  width: 52px;
  height: 52px;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #e3eae7;
  background: #fafcfb;
  position: relative;
}
.quicktech-checkout-review-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.quicktech-checkout-review-thumb .quicktech-checkout-review-qty-badge {
  position: absolute;
  top: -6px;
  right: -6px;
  background: #16211d;
  color: #fff;
  font-size: 10.5px;
  font-weight: 700;
  min-width: 18px;
  height: 18px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
}
.quicktech-checkout-review-name {
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
}
.quicktech-checkout-review-meta {
  font-size: 11.5px;
  color: #6b7a75;
  margin-top: 2px;
}
.quicktech-checkout-review-price {
  font-size: 13px;
  font-weight: 700;
  color: #16211d;
  white-space: nowrap;
}

.quicktech-checkout-promo-box {
  display: flex;
  gap: 8px;
  margin-bottom: 14px;
}
.quicktech-checkout-promo-input {
  flex: 1;
  border: 1px solid #e3eae7;
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 13px;
  min-width: 0;
}
.quicktech-checkout-promo-input:focus {
  outline: 2px solid #21428a;
  outline-offset: 1px;
}
.quicktech-checkout-promo-apply-btn {
  border: none;
  background: #16211d;
  color: #fff;
  padding: 0 16px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
}
.quicktech-checkout-promo-apply-btn:hover {
  background: #21428a;
}
.quicktech-checkout-promo-msg {
  font-size: 12px;
  margin: -8px 0 12px;
  min-height: 14px;
}
.quicktech-checkout-promo-msg.quicktech-checkout-success {
  color: #21428a;
}
.quicktech-checkout-promo-msg.quicktech-checkout-error {
  color: #e23e3e;
}

.quicktech-checkout-summary-rows {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-bottom: 14px;
  border-bottom: 1px dashed #e3eae7;
  margin-bottom: 14px;
}
.quicktech-checkout-summary-row {
  display: flex;
  justify-content: space-between;
  font-size: 13.5px;
  color: #6b7a75;
}
.quicktech-checkout-summary-row span:last-child {
  color: #16211d;
  font-weight: 600;
}
.quicktech-checkout-summary-row.quicktech-checkout-discount span:last-child {
  color: #ff6b4a;
}
.quicktech-checkout-summary-row.quicktech-checkout-delivery
  span:last-child.quicktech-checkout-free {
  color: #21428a;
}

.quicktech-checkout-summary-total {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 20px;
}

.quicktech-checkout-summary-total span:first-child {
  font-family: "Sora", sans-serif;
  font-weight: 700;
  font-size: 20px;
}


.quicktech-checkout-summary-total span:last-child {
  font-family: "Sora", sans-serif;
  font-weight: 800;
  font-size: 22px;
  color: #21428a;
}


.quicktech-checkout-place-order-btn {
  width: 100%;
  background: #21428a;
  color: #fff;
  border: none;
  padding: 16px;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-bottom: 12px;
  box-shadow: 0 6px 18px rgba(14, 159, 110, 0.28);
}

.quicktech-checkout-place-order-btn:hover {
  background: #21428a;
}

.quicktech-checkout-place-order-btn:disabled {
  background: #c9d3d0;
  box-shadow: none;
  cursor: not-allowed;
}

.quicktech-checkout-place-order-btn svg {
  width: 18px;
  height: 18px;
}

.quicktech-checkout-secure-note {
  text-align: center;
  font-size: 12px;
  color: #6b7a75;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-bottom: 16px;
}

.quicktech-checkout-secure-note svg {
  width: 14px;
  height: 14px;
  color: #21428a;
}


.quicktech-checkout-trust-badges {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-top: 14px;
  border-top: 1px solid #e3eae7;
}

.quicktech-checkout-trust-badge {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  color: #6b7a75;
}
.quicktech-checkout-trust-badge svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  color: #21428a;
}

.quicktech-checkout-mobile-checkout-bar {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: #ffffff;
  border-top: 1px solid #e3eae7;
  padding: 12px 16px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  z-index: 40;
  box-shadow: 0 -6px 20px rgba(0, 0, 0, 0.06);
}
.quicktech-checkout-mobile-checkout-bar .quicktech-checkout-mcb-total b {
  display: block;
  font-family: "Sora", sans-serif;
  font-size: 18px;
  color: #21428a;
}
.quicktech-checkout-mobile-checkout-bar .quicktech-checkout-mcb-total span {
  font-size: 11px;
  color: #6b7a75;
}
.quicktech-checkout-mobile-checkout-bar .quicktech-checkout-place-order-btn {
  width: auto;
  padding: 12px 22px;
  margin: 0;
}

@media (max-width: 980px) {
  .quicktech-checkout-layout {
    grid-template-columns: 1fr;
  }
  .quicktech-checkout-order-summary {
    position: static;
  }
}

@media (max-width: 640px) {
  .quicktech-checkout-form-grid {
    grid-template-columns: 1fr;
  }
  .quicktech-checkout-form-field.quicktech-checkout-span-2 {
    grid-column: span 1;
  }
  .quicktech-checkout-section-card {
    padding: 16px;
  }
  .quicktech-checkout {
    padding-bottom: 96px;
  }
  .quicktech-checkout-mobile-checkout-bar {
    display: flex;
  }
  .quicktech-checkout-order-summary .quicktech-checkout-place-order-btn,
  .quicktech-checkout-order-summary .quicktech-checkout-secure-note {
    display: none;
  }
  .quicktech-checkout-steps {
    display: none;
  }
}

/* checkout */

/* donar receiver */
.quicktech-donar-receiver .qt-container {
  max-width: 1180px;
  margin: 0 auto;
}

/* ---------- Hero strip ---------- */
.quicktech-donar-receiver .qt-hero {
  position: relative;
  overflow: hidden;
  border-radius: 26px;
  padding: 38px 34px;
  margin-bottom: 34px;
  background: linear-gradient(120deg, #ce1a22 0%, #ce1a22 45%, #e4213b 100%);
  color: #fff;
  box-shadow: 0 20px 45px -20px rgba(164, 19, 62, 0.35);
}
.quicktech-donar-receiver .qt-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(
    rgba(255, 255, 255, 0.1) 1.6px,
    transparent 1.6px
  );
  background-size: 22px 22px;
  opacity: 0.5;
  pointer-events: none;
}
.quicktech-donar-receiver .qt-hero-drop {
  position: absolute;
  right: -40px;
  top: -50px;
  width: 220px;
  height: 220px;
  opacity: 0.16;
}
.quicktech-donar-receiver .qt-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: "Poppins", sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.09em;
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.35);
  padding: 7px 14px 7px 10px;
  border-radius: 999px;
  margin-bottom: 16px;
}
.quicktech-donar-receiver .qt-eyebrow svg {
  width: 14px;
  height: 14px;
}
.quicktech-donar-receiver .qt-hero h1 {
  font-size: clamp(26px, 3.4vw, 38px);
  font-weight: 700;
  margin: 0 0 10px;
  position: relative;
  z-index: 1;
}
.quicktech-donar-receiver .qt-hero p {
  max-width: 580px;
  font-size: 15.5px;
  color: #ffe3e7;
  margin: 0;
  position: relative;
  z-index: 1;
}
.quicktech-donar-receiver .qt-hero-actions {
  display: flex;
  gap: 14px;
  margin-top: 22px;
  flex-wrap: wrap;
  position: relative;
  z-index: 1;
}
.quicktech-donar-receiver .qt-hero-chip {
  display: flex;
  align-items: center;
  gap: 8px;
  background: rgba(255, 255, 255, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.32);
  padding: 9px 15px;
  border-radius: 12px;
  font-size: 12.5px;
  font-weight: 600;
}
.quicktech-donar-receiver .qt-hero-chip svg {
  width: 15px;
  height: 15px;
}
.quicktech-donar-receiver .qt-hero-hotline {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #fff;
  color: #a4133c;
  padding: 9px 16px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 700;
}
.quicktech-donar-receiver .qt-hero-hotline svg {
  width: 15px;
  height: 15px;
}

/* ---------- Layout ---------- */
.quicktech-donar-receiver .qt-grid {
  display: grid;
  grid-template-columns: 1.55fr 1fr;
  gap: 28px;
  align-items: start;
}

/* ---------- Form Card ---------- */
.quicktech-donar-receiver .qt-card {
  background: #ffffff;
  border-radius: 20px;
  border: 1px solid #f0dcdf;
  box-shadow: 0 16px 40px -28px rgba(122, 12, 37, 0.35);
}
.quicktech-donar-receiver .qt-form-card {
  padding: 8px 8px 26px;
}
.quicktech-donar-receiver .qt-section {
  padding: 22px 26px 6px;
}
.quicktech-donar-receiver .qt-section + .qt-section {
  border-top: 1px dashed #f0dcdf;
  margin-top: 14px;
  padding-top: 24px;
}
.quicktech-donar-receiver .qt-section-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}
.quicktech-donar-receiver .qt-section-icon {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  border-radius: 11px;
  background: #ffe3e8;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #e4213b;
}
.quicktech-donar-receiver .qt-section-icon svg {
  width: 19px;
  height: 19px;
}
.quicktech-donar-receiver .qt-section-head h2 {
  font-size: 16.5px;
  font-weight: 700;
  margin: 0;
}
.quicktech-donar-receiver .qt-section-head span {
  display: block;
  font-size: 12px;
  color: #8a6e73;
  margin-top: 2px;
  font-weight: 500;
}

.quicktech-donar-receiver .qt-field-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 18px;
}
.quicktech-donar-receiver .qt-field {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.quicktech-donar-receiver .qt-field.qt-span2 {
  grid-column: 1 / -1;
}
.quicktech-donar-receiver .qt-field label {
  font-size: 13.5px;
  font-weight: 600;
  color: #4b2e33;
  display: flex;
  align-items: center;
  gap: 6px;
}
.quicktech-donar-receiver .qt-optional {
  font-weight: 500;
  font-size: 11px;
  color: #8a6e73;
  background: #f6eced;
  padding: 2px 8px;
  border-radius: 999px;
}

.quicktech-donar-receiver input[type="text"],
.quicktech-donar-receiver input[type="tel"],
.quicktech-donar-receiver input[type="number"],
.quicktech-donar-receiver input[type="date"],
.quicktech-donar-receiver select,
.quicktech-donar-receiver textarea {
  width: 100%;
  font-family: "Hind Siliguri", sans-serif;
  font-size: 14.5px;
  color: #26161b;
  background: #fcfafa;
  border: 1.5px solid #eedee0;
  border-radius: 12px;
  padding: 11px 13px;
  outline: none;
  transition:
    border-color 0.15s,
    box-shadow 0.15s,
    background 0.15s;
}
.quicktech-donar-receiver textarea {
  resize: vertical;
  min-height: 78px;
}
.quicktech-donar-receiver input:focus,
.quicktech-donar-receiver select:focus,
.quicktech-donar-receiver textarea:focus {
  border-color: #e4213b;
  background: #fff;
  box-shadow: 0 0 0 4px rgba(228, 33, 59, 0.1);
}
.quicktech-donar-receiver input::placeholder,
.quicktech-donar-receiver textarea::placeholder {
  color: #bfa6a9;
}
.quicktech-donar-receiver select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23A4133C' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 34px;
}
.quicktech-donar-receiver .qt-hint {
  font-size: 11.5px;
  color: #8a6e73;
}

/* Blood group pills */
.quicktech-donar-receiver .qt-bg-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 9px;
}
.quicktech-donar-receiver .qt-bg-pill {
  position: relative;
}
.quicktech-donar-receiver .qt-bg-pill input {
  position: absolute;
  opacity: 0;
  inset: 0;
  cursor: pointer;
  margin: 0;
}
.quicktech-donar-receiver .qt-bg-pill label {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1.5px solid #eedee0;
  border-radius: 12px;
  padding: 10px 4px;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 14px;
  color: #a4133c;
  background: #fcfafa;
  cursor: pointer;
  transition: all 0.15s;
}
.quicktech-donar-receiver .qt-bg-pill input:checked + label {
  background: linear-gradient(120deg, #ce1a22 0%, #ce1a22 45%, #e4213b 100%);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 8px 18px -8px rgba(164, 19, 62, 0.6);
}

/* Bags stepper input */
.quicktech-donar-receiver .qt-bag-stepper {
  display: flex;
  align-items: center;
  gap: 10px;
}
.quicktech-donar-receiver .qt-bag-btn {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  border: 1.5px solid #eedee0;
  background: #fcfafa;
  color: #a4133c;
  font-size: 19px;
  font-weight: 700;
  cursor: pointer;
  flex: 0 0 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.15s;
}
.quicktech-donar-receiver .qt-bag-btn:hover {
  background: #ffe3e8;
}
.quicktech-donar-receiver .qt-bag-stepper input {
  text-align: center;
  font-weight: 700;
  font-family: "Poppins", sans-serif;
}

/* Urgency segmented (Emergency / Normal) */
.quicktech-donar-receiver .qt-urgency {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.quicktech-donar-receiver .qt-urgency-opt {
  position: relative;
}
.quicktech-donar-receiver .qt-urgency-opt input {
  position: absolute;
  opacity: 0;
  inset: 0;
  cursor: pointer;
  margin: 0;
}
.quicktech-donar-receiver .qt-urgency-opt label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1.5px solid #eedee0;
  border-radius: 12px;
  padding: 12px 8px;
  cursor: pointer;
  font-weight: 700;
  font-size: 14px;
  color: #8a6e73;
  background: #fcfafa;
  transition: 0.15s;
}
.quicktech-donar-receiver .qt-urgency-opt label svg {
  width: 17px;
  height: 17px;
}
.quicktech-donar-receiver .qt-urgency-opt.qt-emg input:checked + label {
  background: linear-gradient(120deg, #ce1a22 0%, #ce1a22 45%, #e4213b 100%);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 8px 18px -8px rgba(164, 19, 62, 0.6);
  animation: qtPulse 1.6s infinite;
}
.quicktech-donar-receiver .qt-urgency-opt.qt-nrm input:checked + label {
  background: #e9f1ff;
  color: #2465c7;
  border-color: #c7dbfa;
}
@keyframes qtPulse {
  0% {
    box-shadow: 0 0 0 0 rgba(228, 33, 59, 0.45);
  }
  70% {
    box-shadow: 0 0 0 9px rgba(228, 33, 59, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(228, 33, 59, 0);
  }
}

/* Upload */
.quicktech-donar-receiver .qt-upload {
  display: flex;
  align-items: center;
  gap: 16px;
  border: 1.5px dashed #eab9c0;
  border-radius: 14px;
  background: #fff9f9;
  padding: 14px 16px;
}
.quicktech-donar-receiver .qt-upload-preview {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  flex: 0 0 52px;
  background: #ffe3e8;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #e4213b;
}
.quicktech-donar-receiver .qt-upload-preview svg {
  width: 22px;
  height: 22px;
}
.quicktech-donar-receiver .qt-upload-body {
  flex: 1;
}
.quicktech-donar-receiver .qt-upload-body p {
  margin: 0 0 6px;
  font-size: 13.5px;
  font-weight: 600;
}
.quicktech-donar-receiver .qt-upload-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #fff;
  border: 1.5px solid #e4213b;
  color: #a4133c;
  font-size: 12.5px;
  font-weight: 700;
  padding: 7px 13px;
  border-radius: 9px;
  cursor: pointer;
}
.quicktech-donar-receiver .qt-upload-btn:hover {
  background: #ffe3e8;
}
.quicktech-donar-receiver input[type="file"] {
  display: none;
}
.quicktech-donar-receiver .qt-filename {
  font-size: 11.5px;
  color: #8a6e73;
  margin-top: 6px;
}

.quicktech-donar-receiver .qt-note {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  background: #fff7e8;
  border: 1px solid #f6dfae;
  color: #8a5a00;
  border-radius: 12px;
  padding: 11px 13px;
  font-size: 12.5px;
  margin-top: 14px;
}
.quicktech-donar-receiver .qt-note svg {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  margin-top: 1px;
}

/* Submit */
.quicktech-donar-receiver .qt-submit-wrap {
  padding: 22px 26px 4px;
}
.quicktech-donar-receiver .qt-submit {
  width: 100%;
  background: linear-gradient(120deg, #ce1a22 0%, #ce1a22 45%, #e4213b 100%);
  color: #fff;
  border: none;
  border-radius: 14px;
  font-family: "Hind Siliguri", sans-serif;
  font-size: 16.5px;
  font-weight: 700;
  padding: 15px 20px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  box-shadow: 0 16px 30px -14px rgba(164, 19, 62, 0.55);
  transition:
    transform 0.15s,
    box-shadow 0.15s;
}
.quicktech-donar-receiver .qt-submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 34px -14px rgba(164, 19, 62, 0.6);
}
.quicktech-donar-receiver .qt-submit svg {
  width: 19px;
  height: 19px;
}
.quicktech-donar-receiver .qt-submit-sub {
  text-align: center;
  font-size: 11.5px;
  color: #8a6e73;
  margin-top: 10px;
}

/* ---------- Blood Need Profile ticket (sticky preview) ---------- */
.quicktech-donar-receiver .qt-sticky {
  /* position: sticky;
  top: 22px; */
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.quicktech-donar-receiver .qt-ticket {
  border-radius: 22px;
  background: linear-gradient(120deg, #ce1a22 0%, #ce1a22 45%, #e4213b 100%);
  color: #fff;
  padding: 22px 22px 0;
  position: relative;
  overflow: hidden;
  box-shadow: 0 20px 45px -20px rgba(164, 19, 62, 0.35);
}
.quicktech-donar-receiver .qt-ticket::before {
  content: "";
  position: absolute;
  right: -36px;
  bottom: -40px;
  width: 180px;
  height: 180px;
  background: radial-gradient(
    circle,
    rgba(255, 255, 255, 0.14),
    transparent 70%
  );
}
.quicktech-donar-receiver .qt-ticket-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
  z-index: 1;
}
.quicktech-donar-receiver .qt-ticket-brand {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 13px;
}
.quicktech-donar-receiver .qt-ticket-brand svg {
  width: 20px;
  height: 20px;
}
.quicktech-donar-receiver .qt-ticket-urgency {
  font-family: "Poppins", sans-serif;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.03em;
  background: rgba(255, 255, 255, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.4);
  padding: 5px 11px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  gap: 5px;
}
.quicktech-donar-receiver .qt-ticket-urgency.qt-is-emg {
  background: #fff;
  color: #a4133c;
  animation: qtPulse2 1.6s infinite;
}
.quicktech-donar-receiver .qt-ticket-urgency.qt-is-emg::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #e4213b;
}
@keyframes qtPulse2 {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.6);
  }
  70% {
    box-shadow: 0 0 0 8px rgba(255, 255, 255, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}

.quicktech-donar-receiver .qt-ticket-id {
  font-family: "Poppins", sans-serif;
  font-size: 11.5px;
  color: #ffd9de;
  margin: 16px 0 4px;
  letter-spacing: 0.03em;
  position: relative;
  z-index: 1;
}
.quicktech-donar-receiver .qt-ticket-name {
  font-size: 19px;
  font-weight: 700;
  margin: 0 0 14px;
  position: relative;
  z-index: 1;
}

.quicktech-donar-receiver .qt-ticket-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px 10px;
  position: relative;
  z-index: 1;
}
.quicktech-donar-receiver .qt-ticket-grid .qt-tg-item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.quicktech-donar-receiver .qt-ticket-grid svg {
  width: 15px;
  height: 15px;
  margin-top: 2px;
  opacity: 0.85;
  flex: 0 0 15px;
}
.quicktech-donar-receiver .qt-ticket-grid b {
  display: block;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
}
.quicktech-donar-receiver .qt-ticket-grid span {
  font-size: 10.5px;
  color: #ffd9de;
}

.quicktech-donar-receiver .qt-ticket-bg {
  font-family: "Poppins", sans-serif;
  font-weight: 800;
  font-size: 15px;
  background: rgba(255, 255, 255, 0.18);
  border: 1.5px solid rgba(255, 255, 255, 0.45);
  border-radius: 8px;
  padding: 1px 8px;
  display: inline-block;
}

.quicktech-donar-receiver .qt-ticket-divider {
  position: relative;
  margin-top: 20px;
  height: 0;
  border-top: 2px dashed rgba(255, 255, 255, 0.35);
}
.quicktech-donar-receiver .qt-ticket-divider::before,
.quicktech-donar-receiver .qt-ticket-divider::after {
  content: "";
  position: absolute;
  top: -11px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #fff6f5;
}
.quicktech-donar-receiver .qt-ticket-divider::before {
  left: -33px;
}
.quicktech-donar-receiver .qt-ticket-divider::after {
  right: -33px;
}

/* status stepper inside ticket */
.quicktech-donar-receiver .qt-stepper {
  display: flex;
  align-items: center;
  padding: 20px 0 22px;
  position: relative;
  z-index: 1;
}
.quicktech-donar-receiver .qt-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
  flex: 1;
  text-align: center;
}
.quicktech-donar-receiver .qt-step-dot {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.18);
  border: 1.5px solid rgba(255, 255, 255, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Poppins", sans-serif;
  font-size: 11px;
  font-weight: 700;
}
.quicktech-donar-receiver .qt-step.qt-active .qt-step-dot {
  background: #fff;
  color: #a4133c;
  border-color: #fff;
}
.quicktech-donar-receiver .qt-step span {
  font-size: 10.5px;
  color: #ffd9de;
  font-weight: 600;
}
.quicktech-donar-receiver .qt-step.qt-active span {
  color: #fff;
}
.quicktech-donar-receiver .qt-step-line {
  height: 2px;
  flex: 1;
  background: rgba(255, 255, 255, 0.3);
  margin-top: -22px;
}

/* status card below ticket */
.quicktech-donar-receiver .qt-status-card {
  padding: 18px 20px;
}
.quicktech-donar-receiver .qt-status-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0;
}
.quicktech-donar-receiver .qt-status-row + .qt-status-row {
  border-top: 1px solid #f0dcdf;
}
.quicktech-donar-receiver .qt-status-label {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 13.5px;
  font-weight: 600;
  color: #4b2e33;
}
.quicktech-donar-receiver .qt-status-label svg {
  width: 16px;
  height: 16px;
  color: #e4213b;
}

.quicktech-donar-receiver .qt-pill {
  font-family: "Poppins", sans-serif;
  font-size: 11.5px;
  font-weight: 600;
  padding: 5px 11px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.quicktech-donar-receiver .qt-pill.pending {
  background: #fff3da;
  color: #93650a;
}
.quicktech-donar-receiver .qt-pill.matched {
  background: #e9f1ff;
  color: #2465c7;
}
.quicktech-donar-receiver .qt-pill.completed {
  background: #e6f8f0;
  color: #1d9a6c;
}
.quicktech-donar-receiver .qt-pill.dot::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
}

.quicktech-donar-receiver .qt-status-select {
  font-family: "Poppins", sans-serif;
  font-size: 12px;
  font-weight: 600;
  border: 1.5px solid #f0dcdf;
  border-radius: 9px;
  padding: 6px 26px 6px 10px;
  background: #fcfafa;
}

.quicktech-donar-receiver .qt-tip {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 12px;
  color: #8a6e73;
  background: #fbf3f3;
  border-radius: 14px;
  padding: 13px 15px;
}
.quicktech-donar-receiver .qt-tip svg {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  color: #e4213b;
  margin-top: 1px;
}

.quicktech-donar-receiver .qt-toast {
  position: fixed;
  left: 50%;
  bottom: 26px;
  transform: translate(-50%, 30px);
  background: #26161b;
  color: #fff;
  padding: 13px 22px;
  border-radius: 12px;
  font-size: 13.5px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 10px;
  box-shadow: 0 20px 40px -12px rgba(0, 0, 0, 0.4);
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s ease;
  z-index: 50;
}
.quicktech-donar-receiver .qt-toast svg {
  width: 18px;
  height: 18px;
  color: #5fe0a0;
  flex: 0 0 18px;
}
.quicktech-donar-receiver .qt-toast.show {
  opacity: 1;
  transform: translate(-50%, 0);
}

@media (max-width: 980px) {
  .quicktech-donar-receiver .qt-grid {
    grid-template-columns: 1fr;
  }
  .quicktech-donar-receiver .qt-sticky {
    position: static;
  }
  .quicktech-donar-receiver .qt-field-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 520px) {
  .quicktech-donar-receiver {
	padding: 5px 12px 50px;
}
  .quicktech-donar-receiver .qt-hero {
    padding: 28px 20px;
  }
  .quicktech-donar-receiver .qt-section {
    padding: 18px 16px 4px;
  }
  .quicktech-donar-receiver .qt-submit-wrap {
    padding: 18px 16px 2px;
  }
  .quicktech-donar-receiver .qt-bg-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* donar receiver */

/* donar reg */

.quicktech-donar-reg .qt-hero {
  position: relative;
  overflow: hidden;
  border-radius: 26px;
  padding: 38px 34px;
  margin-bottom: 34px;
  background: linear-gradient(120deg, #ce1a22 0%, #ce1a22 45%, #e4213b 100%);
  color: #fff;
  box-shadow: 0 20px 45px -20px rgba(164, 19, 62, 0.35);
}
.quicktech-donar-reg .qt-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(
    rgba(255, 255, 255, 0.1) 1.6px,
    transparent 1.6px
  );
  background-size: 22px 22px;
  opacity: 0.5;
  pointer-events: none;
}
.quicktech-donar-reg .qt-hero-drop {
  position: absolute;
  right: -40px;
  top: -50px;
  width: 220px;
  height: 220px;
  opacity: 0.16;
}
.quicktech-donar-reg .qt-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: "Poppins", sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.09em;
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.35);
  padding: 7px 14px 7px 10px;
  border-radius: 999px;
  margin-bottom: 16px;
}
.quicktech-donar-reg .qt-eyebrow svg {
  width: 14px;
  height: 14px;
}
.quicktech-donar-reg .qt-hero h1 {
  font-size: clamp(26px, 3.4vw, 38px);
  font-weight: 700;
  margin: 0 0 10px;
  position: relative;
  z-index: 1;
}
.quicktech-donar-reg .qt-hero p {
  max-width: 560px;
  font-size: 15.5px;
  color: #ffe3e7;
  margin: 0;
  position: relative;
  z-index: 1;
}
.quicktech-donar-reg .qt-hero-stats {
  display: flex;
  gap: 26px;
  margin-top: 22px;
  flex-wrap: wrap;
  position: relative;
  z-index: 1;
}
.quicktech-donar-reg .qt-hero-stats div b {
  display: block;
  font-family: "Poppins", sans-serif;
  font-size: 21px;
  font-weight: 700;
}
.quicktech-donar-reg .qt-hero-stats div span {
  font-size: 12.5px;
  color: #ffd3d9;
}

/* ---------- Layout ---------- */
.quicktech-donar-reg .qt-grid {
  display: grid;
  grid-template-columns: 1.55fr 1fr;
  gap: 28px;
  align-items: start;
}

/* ---------- Form Card ---------- */
.quicktech-donar-reg .qt-card {
  background: #ffffff;
  border-radius: 20px;
  border: 1px solid #f0dcdf;
  box-shadow: 0 16px 40px -28px rgba(122, 12, 37, 0.35);
}
.quicktech-donar-reg .qt-form-card {
  padding: 8px 8px 26px;
}

.quicktech-donar-reg .qt-section {
  padding: 22px 26px 6px;
}
.quicktech-donar-reg .qt-section + .qt-section {
  border-top: 1px dashed #f0dcdf;
  margin-top: 14px;
  padding-top: 24px;
}

.quicktech-donar-reg .qt-section-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}
.quicktech-donar-reg .qt-section-icon {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  border-radius: 11px;
  background: #ffe3e8;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #e4213b;
}
.quicktech-donar-reg .qt-section-icon svg {
  width: 19px;
  height: 19px;
}
.quicktech-donar-reg .qt-section-head h2 {
  font-size: 16.5px;
  font-weight: 700;
  margin: 0;
}
.quicktech-donar-reg .qt-section-head span {
  display: block;
  font-size: 12px;
  color: #8a6e73;
  margin-top: 2px;
  font-weight: 500;
}

.quicktech-donar-reg .qt-field-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 18px;
}
.quicktech-donar-reg .qt-field {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.quicktech-donar-reg .qt-field.qt-span2 {
  grid-column: 1 / -1;
}

.quicktech-donar-reg .qt-field label {
  font-size: 13.5px;
  font-weight: 600;
  color: #4b2e33;
  display: flex;
  align-items: center;
  gap: 6px;
}
.quicktech-donar-reg .qt-optional {
  font-weight: 500;
  font-size: 11px;
  color: #8a6e73;
  background: #f6eced;
  padding: 2px 8px;
  border-radius: 999px;
}

.quicktech-donar-reg input[type="text"],
.quicktech-donar-reg input[type="tel"],
.quicktech-donar-reg input[type="email"],
.quicktech-donar-reg input[type="number"],
.quicktech-donar-reg input[type="date"],
.quicktech-donar-reg select,
.quicktech-donar-reg textarea {
  width: 100%;
  font-family: "Hind Siliguri", sans-serif;
  font-size: 14.5px;
  color: #26161b;
  background: #fcfafa;
  border: 1.5px solid #eedee0;
  border-radius: 12px;
  padding: 11px 13px;
  outline: none;
  transition:
    border-color 0.15s,
    box-shadow 0.15s,
    background 0.15s;
}
.quicktech-donar-reg textarea {
  resize: vertical;
  min-height: 78px;
}
.quicktech-donar-reg input:focus,
.quicktech-donar-reg select:focus,
.quicktech-donar-reg textarea:focus {
  border-color: #e4213b;
  background: #fff;
  box-shadow: 0 0 0 4px rgba(228, 33, 59, 0.1);
}
.quicktech-donar-reg input::placeholder,
.quicktech-donar-reg textarea::placeholder {
  color: #bfa6a9;
}
.quicktech-donar-reg select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23A4133C' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 34px;
}

.quicktech-donar-reg .qt-hint {
  font-size: 11.5px;
  color: #8a6e73;
}

/* Blood group pills */
.quicktech-donar-reg .qt-bg-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 9px;
}
.quicktech-donar-reg .qt-bg-pill {
  position: relative;
}
.quicktech-donar-reg .qt-bg-pill input {
  position: absolute;
  opacity: 0;
  inset: 0;
  cursor: pointer;
  margin: 0;
}
.quicktech-donar-reg .qt-bg-pill label {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1.5px solid #eedee0;
  border-radius: 12px;
  padding: 10px 4px;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 14px;
  color: #a4133c;
  background: #fcfafa;
  cursor: pointer;
  transition: all 0.15s;
}
.quicktech-donar-reg .qt-bg-pill input:checked + label {
  background: linear-gradient(135deg, #e4213b, #a4133c);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 8px 18px -8px rgba(164, 19, 62, 0.6);
}

/* Gender segmented */
.quicktech-donar-reg .qt-seg {
  display: flex;
  background: #fcfafa;
  border: 1.5px solid #eedee0;
  border-radius: 12px;
  padding: 3px;
  gap: 3px;
}
.quicktech-donar-reg .qt-seg-opt {
  position: relative;
  flex: 1;
}
.quicktech-donar-reg .qt-seg-opt input {
  position: absolute;
  opacity: 0;
  inset: 0;
  cursor: pointer;
  margin: 0;
}
.quicktech-donar-reg .qt-seg-opt label {
  display: block;
  text-align: center;
  font-size: 13.5px;
  font-weight: 600;
  color: #8a6e73;
  padding: 9px 4px;
  border-radius: 9px;
  cursor: pointer;
  transition: all 0.15s;
}
.quicktech-donar-reg .qt-seg-opt input:checked + label {
  background: #ffffff;
  color: #a4133c;
  box-shadow: 0 4px 10px -4px rgba(164, 19, 62, 0.35);
}

/* checkbox row */
.quicktech-donar-reg .qt-check-row {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-top: 2px;
}
.quicktech-donar-reg .qt-check-row input {
  width: 17px;
  height: 17px;
  accent-color: #e4213b;
}
.quicktech-donar-reg .qt-check-row label {
  font-size: 13px;
  color: #8a6e73;
  font-weight: 500;
  margin: 0;
}

/* Photo upload */
.quicktech-donar-reg .qt-upload {
  display: flex;
  align-items: center;
  gap: 16px;
  border: 1.5px dashed #eab9c0;
  border-radius: 14px;
  background: #fff9f9;
  padding: 14px 16px;
}
.quicktech-donar-reg .qt-upload-preview {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  flex: 0 0 64px;
  background: #ffe3e8 center/cover no-repeat;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #e4213b;
  overflow: hidden;
  border: 2px solid #fff;
  box-shadow: 0 0 0 2px #ffe3e8;
}
.quicktech-donar-reg .qt-upload-preview svg {
  width: 24px;
  height: 24px;
}
.quicktech-donar-reg .qt-upload-body {
  flex: 1;
}
.quicktech-donar-reg .qt-upload-body p {
  margin: 0 0 6px;
  font-size: 13.5px;
  font-weight: 600;
}
.quicktech-donar-reg .qt-upload-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #fff;
  border: 1.5px solid #e4213b;
  color: #a4133c;
  font-size: 12.5px;
  font-weight: 700;
  padding: 7px 13px;
  border-radius: 9px;
  cursor: pointer;
}
.quicktech-donar-reg .qt-upload-btn:hover {
  background: #ffe3e8;
}
.quicktech-donar-reg input[type="file"] {
  display: none;
}
.quicktech-donar-reg .qt-filename {
  font-size: 11.5px;
  color: #8a6e73;
  margin-top: 6px;
}

/* payment note */
.quicktech-donar-reg .qt-note {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  background: #fff7e8;
  border: 1px solid #f6dfae;
  color: #8a5a00;
  border-radius: 12px;
  padding: 11px 13px;
  font-size: 12.5px;
  margin-top: 14px;
}
.quicktech-donar-reg .qt-note svg {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  margin-top: 1px;
}

/* Submit */
.quicktech-donar-reg .qt-submit-wrap {
  padding: 22px 26px 4px;
}
.quicktech-donar-reg .qt-submit {
  width: 100%;
  background: linear-gradient(120deg, #ce1a22 0%, #ce1a22 45%, #e4213b 100%);
  color: #fff;
  border: none;
  border-radius: 14px;
  font-family: "Hind Siliguri", sans-serif;
  font-size: 16.5px;
  font-weight: 700;
  padding: 15px 20px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  box-shadow: 0 16px 30px -14px rgba(164, 19, 62, 0.55);
  transition:
    transform 0.15s,
    box-shadow 0.15s;
}
.quicktech-donar-reg .qt-submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 34px -14px rgba(164, 19, 62, 0.6);
}
.quicktech-donar-reg .qt-submit svg {
  width: 19px;
  height: 19px;
}
.quicktech-donar-reg .qt-submit-sub {
  text-align: center;
  font-size: 11.5px;
  color: #8a6e73;
  margin-top: 10px;
}

/* ---------- Donor ID Card (sticky preview) ---------- */
.quicktech-donar-reg .qt-sticky {
  /* position: sticky;
  top: 22px; */
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.quicktech-donar-reg .qt-idcard {
  border-radius: 22px;
  background: linear-gradient(120deg, #ce1a22 0%, #ce1a22 45%, #e4213b 100%);
  color: #fff;
  padding: 22px 22px 0;
  position: relative;
  overflow: hidden;
  box-shadow: 0 20px 45px -20px rgba(164, 19, 62, 0.35);
}
.quicktech-donar-reg .qt-idcard::before {
  content: "";
  position: absolute;
  right: -36px;
  bottom: -40px;
  width: 180px;
  height: 180px;
  background: radial-gradient(
    circle,
    rgba(255, 255, 255, 0.14),
    transparent 70%
  );
}
.quicktech-donar-reg .qt-idcard-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
  z-index: 1;
}
.quicktech-donar-reg .qt-idcard-brand {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.02em;
}
.quicktech-donar-reg .qt-idcard-brand svg {
  width: 20px;
  height: 20px;
}
.quicktech-donar-reg .qt-idcard-badge {
  font-family: "Poppins", sans-serif;
  font-size: 10.5px;
  font-weight: 600;
  background: rgba(255, 255, 255, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.4);
  padding: 5px 10px;
  border-radius: 999px;
}

.quicktech-donar-reg .qt-idcard-body {
  display: flex;
  gap: 16px;
  margin-top: 20px;
  position: relative;
  z-index: 1;
}
.quicktech-donar-reg .qt-idcard-photo {
  width: 74px;
  height: 74px;
  border-radius: 16px;
  flex: 0 0 74px;
  background: rgba(255, 255, 255, 0.14) center/cover no-repeat;
  border: 2px solid rgba(255, 255, 255, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.quicktech-donar-reg .qt-idcard-photo svg {
  width: 30px;
  height: 30px;
  opacity: 0.85;
}
.quicktech-donar-reg .qt-idcard-name {
  font-size: 18px;
  font-weight: 700;
  margin: 0 0 3px;
}
.quicktech-donar-reg .qt-idcard-id {
  font-family: "Poppins", sans-serif;
  font-size: 11.5px;
  color: #ffd9de;
  margin: 0 0 10px;
  letter-spacing: 0.03em;
}
.quicktech-donar-reg .qt-idcard-loc {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  color: #ffe3e7;
}
.quicktech-donar-reg .qt-idcard-loc svg {
  width: 13px;
  height: 13px;
}

.quicktech-donar-reg .qt-idcard-bg {
  font-family: "Poppins", sans-serif;
  font-size: 24px;
  font-weight: 800;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  flex: 0 0 56px;
  background: rgba(255, 255, 255, 0.16);
  border: 1.5px solid rgba(255, 255, 255, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
}

.quicktech-donar-reg .qt-idcard-divider {
  position: relative;
  margin-top: 20px;
  height: 0;
  border-top: 2px dashed rgba(255, 255, 255, 0.35);
}
.quicktech-donar-reg .qt-idcard-divider::before,
.quicktech-donar-reg .qt-idcard-divider::after {
  content: "";
  position: absolute;
  top: -11px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #fff6f5;
}
.quicktech-donar-reg .qt-idcard-divider::before {
  left: -33px;
}
.quicktech-donar-reg .qt-idcard-divider::after {
  right: -33px;
}

.quicktech-donar-reg .qt-idcard-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  padding: 18px 0 20px;
  position: relative;
  z-index: 1;
}
.quicktech-donar-reg .qt-idcard-stats div b {
  display: block;
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  font-weight: 700;
}
.quicktech-donar-reg .qt-idcard-stats div span {
  font-size: 11px;
  color: #ffd9de;
}

/* status card below id card */
.quicktech-donar-reg .qt-status-card {
  padding: 18px 20px;
}
.quicktech-donar-reg .qt-status-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0;
}
.quicktech-donar-reg .qt-status-row + .qt-status-row {
  border-top: 1px solid #f0dcdf;
}
.quicktech-donar-reg .qt-status-label {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 13.5px;
  font-weight: 600;
  color: #4b2e33;
}
.quicktech-donar-reg .qt-status-label svg {
  width: 16px;
  height: 16px;
  color: #e4213b;
}

.quicktech-donar-reg .qt-pill {
  font-family: "Poppins", sans-serif;
  font-size: 11.5px;
  font-weight: 600;
  padding: 5px 11px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.quicktech-donar-reg .qt-pill.pending {
  background: #fff3da;
  color: #93650a;
}
.quicktech-donar-reg .qt-pill.verified {
  background: #e6f8f0;
  color: #1d9a6c;
}
/* .quicktech-donar-reg .qt-pill.dot::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
} */

.quicktech-donar-reg .qt-toggle {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  cursor: pointer;
  user-select: none;
}
.quicktech-donar-reg .qt-toggle input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.quicktech-donar-reg .qt-toggle-track {
  width: 42px;
  height: 24px;
  border-radius: 999px;
  background: #e7d2d5;
  position: relative;
  transition: 0.2s;
}
.quicktech-donar-reg .qt-toggle-track::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  transition: 0.2s;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
.quicktech-donar-reg .qt-toggle input:checked + .qt-toggle-track {
  background: #1d9a6c;
}
.quicktech-donar-reg .qt-toggle input:checked + .qt-toggle-track::after {
  transform: translateX(18px);
}
.quicktech-donar-reg .qt-toggle-text {
  font-size: 12.5px;
  font-weight: 600;
  color: #8a6e73;
  min-width: 52px;
}

.quicktech-donar-reg .qt-tip {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 12px;
  color: #8a6e73;
  background: #fbf3f3;
  border-radius: 14px;
  padding: 13px 15px;
}
.quicktech-donar-reg .qt-tip svg {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  color: #e4213b;
  margin-top: 1px;
}

/* toast */
.quicktech-donar-reg .qt-toast {
  position: fixed;
  left: 50%;
  bottom: 26px;
  transform: translate(-50%, 30px);
  background: #26161b;
  color: #fff;
  padding: 13px 22px;
  border-radius: 12px;
  font-size: 13.5px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 10px;
  box-shadow: 0 20px 40px -12px rgba(0, 0, 0, 0.4);
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s ease;
  z-index: 50;
}
.quicktech-donar-reg .qt-toast svg {
  width: 18px;
  height: 18px;
  color: #5fe0a0;
  flex: 0 0 18px;
}
.quicktech-donar-reg .qt-toast.show {
  opacity: 1;
  transform: translate(-50%, 0);
}

@media (max-width: 980px) {
  .quicktech-donar-reg .qt-grid {
    grid-template-columns: 1fr;
  }
  .quicktech-donar-reg .qt-sticky {
    position: static;
  }
  .quicktech-donar-reg .qt-field-grid {
    grid-template-columns: 1fr;
  }
  .quicktech-donar-reg .qt-bg-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media (max-width: 520px) {
  .quicktech-donar-reg {
    padding: 20px 12px 50px;
  }
  .quicktech-donar-reg .qt-hero {
    padding: 28px 20px;
  }
  .quicktech-donar-reg .qt-section {
    padding: 18px 16px 4px;
  }
  .quicktech-donar-reg .qt-submit-wrap {
    padding: 18px 16px 2px;
  }
}

/* donar reg */

/* donar profile */

.quicktech-doner-profile .qt-hero {
  position: relative;
  overflow: hidden;
  border-radius: 26px;
  padding: 32px 34px;
  margin-bottom: 28px;
  background: linear-gradient(120deg, #ce1a22 0%, #ce1a22 45%, #e4213b 100%);
  color: #fff;
  box-shadow: 0 20px 45px -20px rgba(164, 19, 62, 0.35);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}
.quicktech-doner-profile .qt-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(
    rgba(255, 255, 255, 0.1) 1.6px,
    transparent 1.6px
  );
  background-size: 22px 22px;
  opacity: 0.5;
  pointer-events: none;
}
.quicktech-doner-profile .qt-hero-left {
  position: relative;
  z-index: 1;
}
.quicktech-doner-profile .qt-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: "Poppins", sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: #ffe3e7;
  text-decoration: none;
  margin-bottom: 14px;
  opacity: 0.9;
}
.quicktech-doner-profile .qt-back svg {
  width: 14px;
  height: 14px;
}
.quicktech-doner-profile .qt-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: "Poppins", sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.09em;
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.35);
  padding: 7px 14px 7px 10px;
  border-radius: 999px;
  margin-bottom: 16px;
}
.quicktech-doner-profile .qt-eyebrow svg {
  width: 14px;
  height: 14px;
}
.quicktech-doner-profile .qt-hero h1 {
  font-size: clamp(24px, 3vw, 32px);
  font-weight: 700;
  margin: 0 0 8px;
}
.quicktech-doner-profile .qt-hero p {
  max-width: 520px;
  font-size: 14.5px;
  color: #ffe3e7;
  margin: 0;
}
.quicktech-doner-profile .qt-hero-right {
  position: relative;
  z-index: 1;
  text-align: center;
}
.quicktech-doner-profile .qt-hero-bg {
  font-family: "Poppins", sans-serif;
  font-weight: 800;
  font-size: 40px;
  width: 96px;
  height: 96px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.16);
  border: 2px solid rgba(255, 255, 255, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 8px;
}
.quicktech-doner-profile .qt-hero-right span {
  font-size: 12px;
  color: #ffd3d9;
  font-weight: 600;
}

/* ---------- Layout ---------- */
.quicktech-doner-profile .qt-grid {
  display: grid;
  grid-template-columns: 1fr 1.55fr;
  gap: 28px;
  align-items: start;
}

.quicktech-doner-profile .qt-card {
  background: #ffffff;
  border-radius: 20px;
  border: 1px solid #f0dcdf;
  box-shadow: 0 16px 40px -28px rgba(122, 12, 37, 0.35);
}

/* ---------- Sticky ID card (left) ---------- */
.quicktech-doner-profile .qt-sticky {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.quicktech-doner-profile .qt-idcard {
  border-radius: 22px;
  background: linear-gradient(120deg, #ce1a22 0%, #ce1a22 45%, #e4213b 100%);
  color: #fff;
  padding: 22px 22px 0;
  position: relative;
  overflow: hidden;
  box-shadow: 0 20px 45px -20px rgba(164, 19, 62, 0.35);
}
.quicktech-doner-profile .qt-idcard::before {
  content: "";
  position: absolute;
  right: -36px;
  bottom: -40px;
  width: 180px;
  height: 180px;
  background: radial-gradient(
    circle,
    rgba(255, 255, 255, 0.14),
    transparent 70%
  );
}
.quicktech-doner-profile .qt-idcard-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
  z-index: 1;
}
.quicktech-doner-profile .qt-idcard-brand {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.02em;
}
.quicktech-doner-profile .qt-idcard-brand svg {
  width: 20px;
  height: 20px;
}
.quicktech-doner-profile .qt-idcard-badge {
  font-family: "Poppins", sans-serif;
  font-size: 10.5px;
  font-weight: 600;
  background: rgba(255, 255, 255, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.4);
  padding: 5px 10px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.quicktech-doner-profile .qt-idcard-badge svg {
  width: 11px;
  height: 11px;
}

.quicktech-doner-profile .qt-idcard-body {
  display: flex;
  gap: 16px;
  margin-top: 20px;
  position: relative;
  z-index: 1;
}
.quicktech-doner-profile .qt-idcard-photo {
  width: 78px;
  height: 78px;
  border-radius: 16px;
  flex: 0 0 78px;
  background: rgba(255, 255, 255, 0.14) center/cover no-repeat;
  border: 2px solid rgba(255, 255, 255, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.quicktech-doner-profile .qt-idcard-photo svg {
  width: 32px;
  height: 32px;
  opacity: 0.85;
}
.quicktech-doner-profile .qt-idcard-name {
  font-size: 19px;
  font-weight: 700;
  margin: 0 0 3px;
}
.quicktech-doner-profile .qt-idcard-id {
  font-family: "Poppins", sans-serif;
  font-size: 11.5px;
  color: #ffd9de;
  margin: 0 0 10px;
  letter-spacing: 0.03em;
}
.quicktech-doner-profile .qt-idcard-loc {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  color: #ffe3e7;
}
.quicktech-doner-profile .qt-idcard-loc svg {
  width: 13px;
  height: 13px;
}

.quicktech-doner-profile .qt-idcard-bg {
  font-family: "Poppins", sans-serif;
  font-size: 24px;
  font-weight: 800;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  flex: 0 0 56px;
  background: rgba(255, 255, 255, 0.16);
  border: 1.5px solid rgba(255, 255, 255, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
}

.quicktech-doner-profile .qt-idcard-divider {
  position: relative;
  margin-top: 20px;
  height: 0;
  border-top: 2px dashed #f0dcdf;
}
.quicktech-doner-profile .qt-idcard-divider::before,
.quicktech-doner-profile .qt-idcard-divider::after {
  content: "";
  position: absolute;
  top: -11px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #fff6f5;
}
.quicktech-doner-profile .qt-idcard-divider::before {
  left: -33px;
}
.quicktech-doner-profile .qt-idcard-divider::after {
  right: -33px;
}

.quicktech-doner-profile .qt-idcard-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  padding: 18px 0 20px;
  position: relative;
  z-index: 1;
}
.quicktech-doner-profile .qt-idcard-stats div b {
  display: block;
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  font-weight: 700;
}
.quicktech-doner-profile .qt-idcard-stats div span {
  font-size: 11px;
  color: #ffd9de;
}

/* status card */
.quicktech-doner-profile .qt-status-card {
  padding: 18px 20px;
}
.quicktech-doner-profile .qt-status-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0;
}
.quicktech-doner-profile .qt-status-row + .qt-status-row {
  border-top: 1px solid #f0dcdf;
}
.quicktech-doner-profile .qt-status-label {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 13.5px;
  font-weight: 600;
  color: #4b2e33;
}
.quicktech-doner-profile .qt-status-label svg {
  width: 16px;
  height: 16px;
  color: #e4213b;
}

.quicktech-doner-profile .qt-pill {
  font-family: "Poppins", sans-serif;
  font-size: 11.5px;
  font-weight: 600;
  padding: 5px 11px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.quicktech-doner-profile .qt-pill.pending {
  background: #fff3da;
  color: #93650a;
}
.quicktech-doner-profile .qt-pill.verified {
  background: #e6f8f0;
  color: #1d9a6c;
}
.quicktech-doner-profile .qt-pill.avail {
  background: #e6f8f0;
  color: #1d9a6c;
}
.quicktech-doner-profile .qt-pill.unavail {
  background: #fbe7e7;
  color: #b23a3a;
}
.quicktech-doner-profile .qt-pill.dot::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
}

/* contact buttons */
.quicktech-doner-profile .qt-contact-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.quicktech-doner-profile .qt-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: "Hind Siliguri", sans-serif;
  font-size: 14px;
  font-weight: 700;
  padding: 13px 14px;
  border-radius: 13px;
  cursor: pointer;
  border: none;
  text-decoration: none;
}
.quicktech-doner-profile .qt-btn svg {
  width: 17px;
  height: 17px;
}
.quicktech-doner-profile .qt-btn.primary {
  background: linear-gradient(120deg, #ce1a22 0%, #ce1a22 45%, #e4213b 100%);
  color: #fff;
  box-shadow: 0 16px 30px -14px rgba(164, 19, 62, 0.55);
  grid-column: 1 / -1;
}
.quicktech-doner-profile .qt-btn.primary:hover {
  transform: translateY(-1px);
}
.quicktech-doner-profile .qt-btn.outline {
  background: #fff;
  border: 1.5px solid #e4213b;
  color: #a4133c;
}
.quicktech-doner-profile .qt-btn.outline:hover {
  background: #ffe3e8;
}

.quicktech-doner-profile .qt-tip {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 12px;
  color: #8a6e73;
  background: #fbf3f3;
  border-radius: 14px;
  padding: 13px 15px;
}
.quicktech-doner-profile .qt-tip svg {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  color: #e4213b;
  margin-top: 1px;
}

/* ---------- Right column: detail sections ---------- */
.quicktech-doner-profile .qt-detail-card {
  padding: 8px 8px 26px;
}
.quicktech-doner-profile .qt-section {
  padding: 22px 26px 6px;
}
.quicktech-doner-profile .qt-section + .qt-section {
  border-top: 1px dashed #f0dcdf;
  margin-top: 14px;
  padding-top: 24px;
}

.quicktech-doner-profile .qt-section-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}
.quicktech-doner-profile .qt-section-icon {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  border-radius: 11px;
  background: #ffe3e8;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #e4213b;
}
.quicktech-doner-profile .qt-section-icon svg {
  width: 19px;
  height: 19px;
}
.quicktech-doner-profile .qt-section-head h2 {
  font-size: 16.5px;
  font-weight: 700;
  margin: 0;
}
.quicktech-doner-profile .qt-section-head span {
  display: block;
  font-size: 12px;
  color: #8a6e73;
  margin-top: 2px;
  font-weight: 500;
}

.quicktech-doner-profile .qt-info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 18px;
}
.quicktech-doner-profile .qt-info-item {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.quicktech-doner-profile .qt-info-item.qt-span2 {
  grid-column: 1 / -1;
}
.quicktech-doner-profile .qt-info-item label {
  font-size: 12px;
  font-weight: 600;
  color: #8a6e73;
}
.quicktech-doner-profile .qt-info-item p {
  margin: 0;
  font-size: 14.5px;
  font-weight: 600;
  color: #26161b;
  background: #fcfafa;
  border: 1.5px solid #eedee0;
  border-radius: 12px;
  padding: 10px 13px;
}
.quicktech-doner-profile .qt-info-item p.masked {
  color: #8a6e73;
  font-weight: 500;
  letter-spacing: 0.04em;
}

.quicktech-doner-profile .qt-note {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  background: #fff7e8;
  border: 1px solid #f6dfae;
  color: #8a5a00;
  border-radius: 12px;
  padding: 11px 13px;
  font-size: 12.5px;
  margin: 16px 26px 4px;
}
.quicktech-doner-profile .qt-note svg {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  margin-top: 1px;
}

/* history list */
.quicktech-doner-profile .qt-history {
  padding: 0 26px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.quicktech-doner-profile .qt-history-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #fcfafa;
  border: 1.5px solid #eedee0;
  border-radius: 12px;
  padding: 11px 14px;
}
.quicktech-doner-profile .qt-history-row .qt-h-left {
  display: flex;
  align-items: center;
  gap: 10px;
}
.quicktech-doner-profile .qt-history-row .qt-h-icon {
  width: 32px;
  height: 32px;
  border-radius: 9px;
  background: #e6f8f0;
  color: #1d9a6c;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 32px;
}
.quicktech-doner-profile .qt-history-row .qt-h-icon svg {
  width: 16px;
  height: 16px;
}
.quicktech-doner-profile .qt-history-row b {
  font-size: 13.5px;
  display: block;
}
.quicktech-doner-profile .qt-history-row span {
  font-size: 11.5px;
  color: #8a6e73;
}

@media (max-width: 980px) {
  .quicktech-doner-profile .qt-grid {
    grid-template-columns: 1fr;
  }
  .quicktech-doner-profile .qt-sticky {
    position: static;
  }
  .quicktech-doner-profile .qt-info-grid {
    grid-template-columns: 1fr;
  }
  .quicktech-doner-profile .qt-hero {
    flex-direction: column;
    align-items: flex-start;
  }
}
@media (max-width: 520px) {
  .quicktech-doner-profile {
    padding: 20px 12px 50px;
  }
  .quicktech-doner-profile .qt-hero {
    padding: 26px 20px;
  }
  .quicktech-doner-profile .qt-section {
    padding: 18px 16px 4px;
  }
  .quicktech-doner-profile .qt-note {
    margin: 16px 16px 4px;
  }
  .quicktech-doner-profile .qt-history {
    padding: 0 16px;
  }
}

.donarlist-page-grid {
  grid-template-columns: repeat(6, 1fr);
}

/* donar profile */

.quicktech-profile-btn i {
  font-size: 30px;
  color: black;
}

.quicktech-login {
  display: flex;
  height: 70vh;
  width: 100%;
}

/* =========================================
       LEFT SIDE: ANIMATION & BRANDING
       ========================================= */
.quicktech-login-left-panel {
  flex: 1.2;
  background: #122c54;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 60px;
  color: white;
}

/* Animated Gradient Blobs */
.quicktech-login-blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.6;
  animation: float 10s infinite ease-in-out alternate;
}
.quicktech-login-blob-1 {
  width: 400px;
  height: 400px;
  background: #21428a;
  top: -10%;
  left: -10%;
  animation-delay: 0s;
}
.quicktech-login-blob-2 {
  width: 500px;
  height: 500px;
  background: #2a5298;
  bottom: -20%;
  right: -10%;
  animation-duration: 12s;
}
.quicktech-login-blob-3 {
  width: 300px;
  height: 300px;
  background: #00a896;
  top: 40%;
  left: 40%;
  animation-duration: 15s;
  animation-direction: alternate-reverse;
}

@keyframes float {
  0% {
    transform: translate(0, 0) scale(1);
  }
  50% {
    transform: translate(30px, -50px) scale(1.1);
  }
  100% {
    transform: translate(-40px, 20px) scale(0.9);
  }
}

/* Glassmorphism Content Box */
.quicktech-login-glass-content {
  position: relative;
  z-index: 10;
  background: rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.1);
  padding: 50px;
  border-radius: 24px;
  max-width: 500px;
  transform: translateY(20px);
  opacity: 0;
  animation: fadeUp 1s ease forwards 0.5s;
}

.quicktech-login-glass-content h1 {
  font-size: 3rem;
  font-weight: 800;
  line-height: 1.2;
  margin-bottom: 20px;
}

.quicktech-login-glass-content h1 span {
  color: #4fd1c5;
}

.quicktech-login-glass-content p {
  font-size: 1.1rem;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.8);
}

/* =========================================
       RIGHT SIDE: FORM AREA
       ========================================= */
.quicktech-login-right-panel {
  flex: 1;
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.quicktech-login-form-wrapper {
  width: 100%;
  max-width: 80%;
  padding: 40px;
  opacity: 0;
  
  animation: slideIn 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  padding-top: 0 !important;
}

.quicktech-login-logo-text {
  font-size: 1.5rem;
  font-weight: 800;
  color: #122c54;
  margin-bottom: 40px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.quicktech-login-logo-icon {
  width: 32px;
  height: 32px;
  background: #21428a;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
}

.quicktech-login-form-header h2 {
  font-size: 2rem;
  color: #1e293b;
  font-weight: 700;
  margin-bottom: 8px;
}

.quicktech-login-form-header p {
  color: #64748b;
  margin-bottom: 40px;
  font-size: 0.95rem;
}

/* Input Styling */
.quicktech-login-input-group {
  margin-bottom: 24px;
}

.quicktech-login-input-label {
  display: block;
  font-weight: 600;
  font-size: 0.875rem;
  color: #1e293b;
  margin-bottom: 10px;
}

.quicktech-login-phone-input-container {
  display: flex;
  align-items: center;
  background: #f8fafc;
  border: 2px solid transparent;
  border-radius: 14px;
  transition: all 0.3s ease;
}

.quicktech-login-phone-input-container:focus-within {
  background: #ffffff;
  border-color: #21428a;
  box-shadow: 0 0 0 4px rgba(0, 118, 112, 0.1);
}

.quicktech-login-country-code {
  padding: 16px 20px;
  font-weight: 700;
  color: #1e293b;
  border-right: 2px solid #e2e8f0;
  display: flex;
  align-items: center;
  gap: 8px;
}

.quicktech-login-phone-input {
  flex: 1;
  border: none;
  background: transparent;
  padding: 16px;
  font-size: 1rem;
  font-family: inherit;
  color: #1e293b;
  outline: none;
  font-weight: 500;
}

.quicktech-login-phone-input::placeholder {
  color: #94a3b8;
  font-weight: 400;
}

/* Button Styling */
.quicktech-login-btn-submit {
  width: 100%;
  background: #21428a;
  color: white;
  border: none;
  padding: 18px;
  border-radius: 14px;
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
  margin-top: 10px;
}

.quicktech-login-btn-submit::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.2),
    transparent
  );
  transition: all 0.5s ease;
}

.quicktech-login-btn-submit:hover {
  background: #009b93;
  transform: translateY(-2px);
  box-shadow: 0 10px 20px rgba(0, 118, 112, 0.25);
}

.quicktech-login-btn-submit:hover::before {
  left: 100%;
}

.quicktech-login-btn-submit:active {
  transform: translateY(0);
}

/* Animations */
@keyframes fadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes slideIn {
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* Responsive */
@media (max-width: 992px) {
  .quicktech-login-left-panel {
    display: none;
  }
  .quicktech-login-right-panel {
    flex: 1;
  }
  .quicktech-login-form-wrapper {
    padding: 15px;
  }
}

/*  */

.quicktech-otp-split-layout {
  display: flex;
  height: 70vh;
  width: 100%;
}

/* =========================================
       LEFT SIDE: ANIMATION & BRANDING
       ========================================= */
.quicktech-otp-left-panel {
  flex: 1.2;
  background: #122c54;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 60px;
  color: white;
}

.quicktech-otp-blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.6;
  animation: float 10s infinite ease-in-out alternate;
}

.quicktech-otp-blob-1 {
  width: 400px;
  height: 400px;
  background: #21428a;
  top: -10%;
  left: -10%;
}

.quicktech-otp-blob-2 {
  width: 500px;
  height: 500px;
  background: #2a5298;
  bottom: -20%;
  right: -10%;
  animation-duration: 12s;
}

.quicktech-otp-blob-3 {
  width: 300px;
  height: 300px;
  background: #00a896;
  top: 40%;
  left: 40%;
  animation-duration: 15s;
  animation-direction: alternate-reverse;
}

@keyframes float {
  0% {
    transform: translate(0, 0) scale(1);
  }
  50% {
    transform: translate(30px, -50px) scale(1.1);
  }
  100% {
    transform: translate(-40px, 20px) scale(0.9);
  }
}

.quicktech-otp-glass-content {
  position: relative;
  z-index: 10;
  background: rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.1);
  padding: 50px;
  border-radius: 24px;
  max-width: 500px;
  animation: fadeUp 1s ease forwards 0.5s;
  opacity: 0;
  transform: translateY(20px);
}

.quicktech-otp-glass-content h1 {
  font-size: 3rem;
  font-weight: 800;
  line-height: 1.2;
  margin-bottom: 20px;
}

.quicktech-otp-glass-content h1 span {
  color: #4fd1c5;
}

.quicktech-otp-glass-content p {
  font-size: 1.1rem;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.8);
}

/* =========================================
       RIGHT SIDE: OTP FORM AREA
       ========================================= */
.quicktech-otp-right-panel {
  flex: 1;
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.quicktech-otp-form-wrapper {
  width: 100%;
  max-width: 70%;
  padding: 40px;
  opacity: 0;
  transform: translateX(30px);
  animation: slideIn 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.quicktech-otp-back-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #64748b;
  text-decoration: none;
  font-size: 0.9rem;
  font-weight: 600;
  margin-bottom: 30px;
  transition: color 0.2s;
}

.quicktech-otp-back-link:hover {
  color: #21428a;
}

.quicktech-otp-logo-text {
  font-size: 1.5rem;
  font-weight: 800;
  color: #122c54;
  margin-bottom: 40px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.quicktech-otp-logo-icon {
  width: 32px;
  height: 32px;
  background: #21428a;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
}

.quicktech-otp-form-header h2 {
  font-size: 2rem;
  color: #1e293b;
  font-weight: 700;
  margin-bottom: 8px;
}

.quicktech-otp-form-header p {
  color: #64748b;
  margin-bottom: 35px;
  font-size: 0.95rem;
  line-height: 1.5;
}

.quicktech-otp-phone-highlight {
  color: #1e293b;
  font-weight: 700;
}

/* OTP Field Grid */
.quicktech-otp-grid {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 28px;
}

.quicktech-otp-box {
  width: 56px;
  height: 64px;
  border: 2px solid #e2e8f0;
  border-radius: 14px;
  background: #f8fafc;
  text-align: center;
  font-size: 1.5rem;
  font-weight: 700;
  color: #122c54;
  outline: none;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.quicktech-otp-box:focus {
  background: #ffffff;
  border-color: #21428a;
  box-shadow: 0 0 0 4px rgba(0, 118, 112, 0.1);
  transform: translateY(-2px);
}

/* Resend Text & Dynamic State */
.quicktech-otp-timer-container {
  text-align: center;
  margin-bottom: 30px;
  font-size: 0.95rem;
  color: #64748b;
  font-weight: 500;
}

.quicktech-otp-resend-btn {
  color: #21428a;
  background: none;
  border: none;
  font-family: inherit;
  font-size: 0.95rem;
  font-weight: 700;
  cursor: pointer;
  display: none;
  transition: color 0.2s;
}

.quicktech-otp-resend-btn:hover {
  color: #009b93;
  text-decoration: underline;
}

.quicktech-otp-btn-submit {
  width: 100%;
  background: #21428a;
  color: white;
  border: none;
  padding: 18px;
  border-radius: 14px;
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
}

.quicktech-otp-btn-submit:hover {
  background: #009b93;
  transform: translateY(-2px);
  box-shadow: 0 10px 20px rgba(0, 118, 112, 0.25);
}

.quicktech-otp-btn-submit:active {
  transform: translateY(0);
}

/* Animations */
@keyframes fadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes slideIn {
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* Responsive */
@media (max-width: 992px) {
  .quicktech-otp-left-panel {
    display: none;
  }
  .quicktech-otp-right-panel {
    flex: 1;
  }
  .quicktech-otp-form-wrapper {
    padding: 20px;
  }
 .quicktech-otp-box {
	width: 38px;
	height: 46px;
	font-size: 1.3rem;
}
}

/*  */

/* dashboard */

.quicktech-dashboard-pulse {
  width: 100%;
  height: 20px;
  overflow: hidden;
}
.quicktech-dashboard-pulse svg {
  width: 100%;
  height: 100%;
}
.quicktech-dashboard-pulse path {
  fill: none;
  stroke: #14b8a6;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 340;
  stroke-dashoffset: 340;
  animation: quicktech-dashboard-draw 1.6s ease-out forwards 0.2s;
}
@keyframes quicktech-dashboard-draw {
  to {
    stroke-dashoffset: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .quicktech-dashboard-pulse path {
    animation: none;
    stroke-dashoffset: 0;
  }
}

/* ==========================================================================
   3. ICON SYSTEM
   ========================================================================== */
.quicktech-dashboard-icon {
  width: 1em;
  height: 1em;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex-shrink: 0;
}

/* ==========================================================================
   4. LAYOUT SHELL
   ========================================================================== */
.quicktech-dashboard-shell {
  display: flex;
  min-height: 100vh;
}

/* ---- Sidebar ---- */
.quicktech-dashboard-sidebar {
  width: 272px;
  flex-shrink: 0;
  background: #21428a;
  color: #eafaf6;
  display: flex;
  flex-direction: column;
  position: fixed;
  inset: 0 auto 0 0;
  height: 100vh;
  z-index: 40;
  transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
}
.quicktech-dashboard-sidebar__brand {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 1.5rem 1.5rem 1.25rem;
  background-color: #21428a12;
}
.quicktech-dashboard-sidebar__brand img{
  height: 50px;
  background: white;
  border-radius: 5px;
  padding: 4px;
}

.quicktech-dashboard-sidebar__logo {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: #14b8a6;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #21428a;
  flex-shrink: 0;
}
.quicktech-dashboard-sidebar__logo .quicktech-dashboard-icon {
  width: 20px;
  height: 20px;
  stroke-width: 2.4;
}
.quicktech-dashboard-sidebar__title {
  font-family: "Lexend", sans-serif;
  font-weight: 700;
  font-size: 1.02rem;
  line-height: 1.1;
  color: #fff;
}
.quicktech-dashboard-sidebar__tag {
  font-size: 0.68rem;
  color: rgba(234, 250, 246, 0.55);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.quicktech-dashboard-sidebar__close {
  display: none;
  margin-left: auto;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  color: rgba(234, 250, 246, 0.75);
  flex-shrink: 0;
}
.quicktech-dashboard-sidebar__close:hover {
  background: rgba(234, 250, 246, 0.1);
  color: #fff;
}

.quicktech-dashboard-sidebar__nav {
  flex: 1;
  overflow-y: auto;
  padding: 0.5rem 0.9rem;
}
.quicktech-dashboard-sidebar__group-label {
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(234, 250, 246, 0.4);
  margin: 1.1rem 0.6rem 0.4rem;
}
.quicktech-dashboard-navlink {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.68rem 0.75rem;
  border-radius: 8px;
  color: rgba(234, 250, 246, 0.78);
  font-size: 0.9rem;
  font-weight: 500;
  width: 100%;
  text-align: left;
  transition:
    background 180ms cubic-bezier(0.4, 0, 0.2, 1),
    color 180ms cubic-bezier(0.4, 0, 0.2, 1);
    border: none;
  background: transparent;
}
.quicktech-dashboard-navlink .quicktech-dashboard-icon {
  width: 18px;
  height: 18px;
  opacity: 0.85;
}
.quicktech-dashboard-navlink:hover {
  background: rgba(234, 250, 246, 0.08);
  color: #fff;
}
.quicktech-dashboard-navlink.is-active {
  background: white;
  color: #21428a;
  font-weight: 600;
}
.quicktech-dashboard-navlink.is-active .quicktech-dashboard-icon {
  opacity: 1;
}
.quicktech-dashboard-navlink__badge {
  margin-left: auto;
  font-size: 0.68rem;
  font-weight: 700;
  padding: 0.1rem 0.45rem;
  border-radius: 999px;
  background: #d7263d;
  color: #fff;
}

.quicktech-dashboard-sidebar__footer {
  padding: 1rem 0.9rem 1.25rem;
  border-top: 1px solid rgba(234, 250, 246, 0.1);
}
.quicktech-dashboard-sidebar__emergency {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  background: rgba(215, 38, 61, 0.16);
  border: 1px solid rgba(215, 38, 61, 0.4);
  border-radius: 14px;
  padding: 0.7rem 0.8rem;
  margin-bottom: 0.6rem;
}
.quicktech-dashboard-sidebar__emergency .quicktech-dashboard-icon {
  color: #ff8a97;
  width: 18px;
  height: 18px;
}
.quicktech-dashboard-sidebar__emergency-label {
  font-size: 0.65rem;
  color: rgba(234, 250, 246, 0.6);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.quicktech-dashboard-sidebar__emergency-number {
  font-family: "JetBrains Mono", monospace;
  font-weight: 600;
  font-size: 0.85rem;
  color: #fff;
}
.quicktech-dashboard-logout {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  width: 100%;
  padding: 0.65rem 0.75rem;
  border-radius: 8px;
  color: rgba(234, 250, 246, 0.65);
  font-size: 0.88rem;
  font-weight: 500;
}
.quicktech-dashboard-logout:hover {
  background: rgba(234, 250, 246, 0.08);
  color: #fff;
}

/* ---- Backdrop for mobile sidebar ---- */
.quicktech-dashboard-sidebar-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(6, 16, 14, 0.55);
  z-index: 39;
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1);
}
.quicktech-dashboard-sidebar-backdrop.is-open {
  opacity: 1;
  pointer-events: auto;
}

/* ---- Main column ---- */
.quicktech-dashboard-main {
  flex: 1;
  margin-left: 272px;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

/* ---- Topbar ---- */
.quicktech-dashboard-topbar {
  height: 72px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0 1.75rem;
  background: #ffffff;
  border-bottom: 1px solid #e0ece8;
  position: sticky;
  top: 0;
  z-index: 30;
}
.quicktech-dashboard-topbar__menu-btn {
  display: none;
  width: 38px;
  height: 38px;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  color: #33453f;
}
.quicktech-dashboard-topbar__menu-btn:hover {
  background: #21428a12;
}
.quicktech-dashboard-search {
  flex: 1;
  max-width: 420px;
  display: flex;
  align-items: center;
  gap: 0.55rem;
  background: #21428a12;
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 0.55rem 1rem;
  color: #5f766f;
  transition: border-color 180ms cubic-bezier(0.4, 0, 0.2, 1);
}
.quicktech-dashboard-search:focus-within {
  border-color: #14b8a6;
}
.quicktech-dashboard-search .quicktech-dashboard-icon {
  width: 16px;
  height: 16px;
}
.quicktech-dashboard-search input {
  flex: 1;
  background: none;
  border: none;
  outline: none;
  font-size: 0.87rem;
  color: #0e1f1c;
}
.quicktech-dashboard-topbar__actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.quicktech-dashboard-iconbtn {
  position: relative;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #33453f;
  transition: background 180ms cubic-bezier(0.4, 0, 0.2, 1);
}
.quicktech-dashboard-iconbtn:hover {
  background: #21428a12;
}
.quicktech-dashboard-iconbtn .quicktech-dashboard-icon {
  width: 19px;
  height: 19px;
}
.quicktech-dashboard-iconbtn__dot {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #d7263d;
  border: 2px solid #ffffff;
}
.quicktech-dashboard-callbtn {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  background: #d7263d;
  color: #fff;
  padding: 0.55rem 1rem;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 600;
  box-shadow: 0 10px 24px -8px rgba(215, 38, 61, 0.3);
  transition:
    transform 180ms cubic-bezier(0.4, 0, 0.2, 1),
    background 180ms cubic-bezier(0.4, 0, 0.2, 1);
}
.quicktech-dashboard-callbtn:hover {
  background: #a91330;
  transform: translateY(-1px);
}
.quicktech-dashboard-callbtn .quicktech-dashboard-icon {
  width: 15px;
  height: 15px;
}
.quicktech-dashboard-userchip {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.35rem 0.6rem 0.35rem 0.35rem;
  border-radius: 999px;
  border: 1px solid #e0ece8;
}
.quicktech-dashboard-userchip:hover {
  background: #21428a12;
}
.quicktech-dashboard-userchip__avatar {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #21428a12;
  color: #21428a;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Lexend", sans-serif;
  font-weight: 700;
  font-size: 0.85rem;
}
.quicktech-dashboard-userchip__name {
  font-size: 0.83rem;
  font-weight: 600;
  line-height: 1.1;
  display: block;
}
.quicktech-dashboard-userchip__role {
  font-size: 0.7rem;
  color: #5f766f;
}

/* ==========================================================================
   5. CONTENT AREA
   ========================================================================== */
.quicktech-dashboard-content {
  padding: 1.75rem;
  max-width: 1360px;
  width: 100%;
  margin: 0 auto;
}
.quicktech-dashboard-eyebrow {
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #128577;
}

/* ---- Section panels (SPA-style, switched by sidebar nav) ---- */
.quicktech-dashboard-panel {
  display: none;
}
.quicktech-dashboard-panel.is-active {
  display: block;
  animation: quicktech-dashboard-fade 0.25s ease;
}
@keyframes quicktech-dashboard-fade {
  from {
    opacity: 0;
    transform: translateY(4px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

.quicktech-dashboard-panel-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 1.2rem;
}
.quicktech-dashboard-panel-head h2 {
  font-family: "Lexend", sans-serif;
  font-size: 1.3rem;
  font-weight: 700;
}
.quicktech-dashboard-panel-head__count {
  font-size: 0.82rem;
  color: #5f766f;
  margin-top: 0.15rem;
}

/* ---- External-link button ---- */
.quicktech-dashboard-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  padding: 0.62rem 1.1rem;
  border-radius: 8px;
  font-size: 0.83rem;
  font-weight: 700;
  transition:
    background 180ms cubic-bezier(0.4, 0, 0.2, 1),
    color 180ms cubic-bezier(0.4, 0, 0.2, 1),
    border-color 180ms cubic-bezier(0.4, 0, 0.2, 1),
    transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
}
.quicktech-dashboard-btn .quicktech-dashboard-icon {
  width: 15px;
  height: 15px;
}
.quicktech-dashboard-btn--primary {
  background: #21428a;
  color: #fff;
}
.quicktech-dashboard-btn--primary:hover {
  background: #21428a;
  color: white;
}
.quicktech-dashboard-btn--blood {
  background: #d7263d;
  color: #fff;
}
.quicktech-dashboard-btn--blood:hover {
  background: #a91330;
   color: white;
}
.quicktech-dashboard-btn--ghost {
  background: transparent;
  color: #33453f;
  border: 1px solid #e0ece8;
}
.quicktech-dashboard-btn--ghost:hover {
  background: #21428a12;
   color: white;
}
.quicktech-dashboard-btn--sm {
  padding: 0.42rem 0.8rem;
  font-size: 0.76rem;
}
.quicktech-dashboard-btn--block {
  width: 100%;
}

.quicktech-dashboard-external-note {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.72rem;
  color: #5f766f;
  margin-top: 0.4rem;
}
.quicktech-dashboard-external-note .quicktech-dashboard-icon {
  width: 12px;
  height: 12px;
}

/* ---- Welcome banner ---- */
.quicktech-dashboard-welcome {
  background: linear-gradient(120deg, #21428a, #21428a);
  border-radius: 22px;
  padding: 1.9rem 2rem;
  color: #eafaf6;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
  flex-wrap: wrap;
  position: relative;
  overflow: hidden;
  margin-bottom: 1.5rem;
}
.quicktech-dashboard-welcome::after {
  content: "";
  position: absolute;
  right: -60px;
  top: -60px;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    rgba(20, 184, 166, 0.35),
    transparent 70%
  );
}
.quicktech-dashboard-welcome__heading {
  font-family: "Lexend", sans-serif;
  font-size: 1.55rem;
  font-weight: 700;
  margin: 0.35rem 0 0.3rem;
}
.quicktech-dashboard-welcome__sub {
  font-size: 0.9rem;
  color: rgba(234, 250, 246, 0.75);
  max-width: 46ch;
}
.quicktech-dashboard-welcome__meta {
  display: flex;
  gap: 1.75rem;
  flex-wrap: wrap;
  position: relative;
  z-index: 1;
}
.quicktech-dashboard-welcome__meta-label {
  font-size: 0.68rem;
  color: rgba(234, 250, 246, 0.55);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.quicktech-dashboard-welcome__meta-value {
  font-family: "JetBrains Mono", monospace;
  font-weight: 600;
  font-size: 0.98rem;
}
.quicktech-dashboard-bloodchip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  background: rgba(215, 38, 61, 0.22);
  border: 1px solid rgba(255, 138, 151, 0.4);
  color: #ffd7dc;
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  font-weight: 700;
  font-size: 0.8rem;
}

/* ---- Stat cards ---- */
.quicktech-dashboard-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.quicktech-dashboard-stat {
  background: #ffffff;
  border: 1px solid #e0ece8;
  border-radius: 14px;
  padding: 1.1rem 1.2rem;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  box-shadow: 0 1px 3px rgba(14, 31, 28, 0.06);
  transition:
    transform 180ms cubic-bezier(0.4, 0, 0.2, 1),
    box-shadow 180ms cubic-bezier(0.4, 0, 0.2, 1);
  cursor: pointer;
}
.quicktech-dashboard-stat:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 28px -8px rgba(15, 110, 100, 0.18);
}
.quicktech-dashboard-stat__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.quicktech-dashboard-stat__icon {
  width: 38px;
  height: 38px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.quicktech-dashboard-stat__icon .quicktech-dashboard-icon {
  width: 19px;
  height: 19px;
}
.quicktech-dashboard-stat__icon--teal {
  background: #21428a12;
  color: #21428a;
}
.quicktech-dashboard-stat__icon--amber {
  background: #fef3e2;
  color: #d97706;
}
.quicktech-dashboard-stat__icon--blood {
  background: #fce6e9;
  color: #d7263d;
}
.quicktech-dashboard-stat__icon--success {
  background: #e6f6ec;
  color: #15803d;
}
.quicktech-dashboard-stat__value {
  font-family: "Lexend", sans-serif;
  font-size: 1.65rem;
  font-weight: 700;
}
.quicktech-dashboard-stat__label {
  font-size: 0.8rem;
  color: #5f766f;
}

/* ---- Section head + link ---- */
.quicktech-dashboard-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 0.9rem;
  gap: 1rem;
  flex-wrap: wrap;
}
.quicktech-dashboard-section-title {
  font-family: "Lexend", sans-serif;
  font-size: 1.15rem;
  font-weight: 700;
}
.quicktech-dashboard-section-link {
  font-size: 0.82rem;
  font-weight: 600;
  color: #21428a;
  display: flex;
  align-items: center;
  gap: 0.25rem;
}
.quicktech-dashboard-section-link .quicktech-dashboard-icon {
  width: 14px;
  height: 14px;
}

/* ---- Quick links (Overview) ---- */
.quicktech-dashboard-quicklinks {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  margin-bottom: 2rem;
}
.quicktech-dashboard-quicklink {
  background: #ffffff;
  border: 1px solid #e0ece8;
  border-radius: 22px;
  padding: 1.3rem;
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
  text-align: left;
  box-shadow: 0 1px 3px rgba(14, 31, 28, 0.06);
  transition:
    transform 180ms cubic-bezier(0.4, 0, 0.2, 1),
    box-shadow 180ms cubic-bezier(0.4, 0, 0.2, 1),
    border-color 180ms cubic-bezier(0.4, 0, 0.2, 1);
}
.quicktech-dashboard-quicklink:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 28px -8px rgba(15, 110, 100, 0.18);
  border-color: #14b8a6;
}
.quicktech-dashboard-quicklink__icon {
  width: 46px;
  height: 46px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.quicktech-dashboard-quicklink__icon .quicktech-dashboard-icon {
  width: 22px;
  height: 22px;
}
.quicktech-dashboard-quicklink__title {
  font-family: "Lexend", sans-serif;
  font-weight: 700;
  font-size: 1rem;
}
.quicktech-dashboard-quicklink__desc {
  font-size: 0.82rem;
  color: #5f766f;
  line-height: 1.4;
}
.quicktech-dashboard-quicklink__cta {
  font-size: 0.82rem;
  font-weight: 700;
  color: #21428a;
  display: flex;
  align-items: center;
  gap: 0.3rem;
  margin-top: auto;
}
.quicktech-dashboard-quicklink__cta .quicktech-dashboard-icon {
  width: 14px;
  height: 14px;
  transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
}
.quicktech-dashboard-quicklink:hover
  .quicktech-dashboard-quicklink__cta
  .quicktech-dashboard-icon {
  transform: translate(2px, -2px);
}

/* ---- Grid layout ---- */
.quicktech-dashboard-grid {
  display: grid;
  grid-template-columns: 1.65fr 1fr;
  gap: 1.5rem;
  align-items: start;
}
.quicktech-dashboard-stack {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

/* ---- Card shell ---- */
.quicktech-dashboard-card {
  background: #ffffff;
  border: 1px solid #e0ece8;
  border-radius: 22px;
  box-shadow: 0 1px 3px rgba(14, 31, 28, 0.06);
  overflow: hidden;
}
.quicktech-dashboard-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.2rem 1.3rem 0.9rem;
  gap: 1rem;
  flex-wrap: wrap;
}
.quicktech-dashboard-card__title {
  font-family: "Lexend", sans-serif;
  font-weight: 700;
  font-size: 1rem;
}
.quicktech-dashboard-card__body {
  padding: 0 1.3rem 1.3rem;
}

/* ---- Tabs (Donor / Receiver) ---- */
.quicktech-dashboard-tabs {
  display: flex;
  gap: 0.4rem;
  background: #21428a12;
  padding: 0.3rem;
  border-radius: 999px;
}
.quicktech-dashboard-tab {
  flex: 1;
  text-align: center;
  padding: 0.5rem 0.8rem;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 600;
  color: #5f766f;
  transition:
    background 180ms cubic-bezier(0.4, 0, 0.2, 1),
    color 180ms cubic-bezier(0.4, 0, 0.2, 1);
}
.quicktech-dashboard-tab.is-active {
  background: #ffffff;
  color: #d7263d;
  box-shadow: 0 1px 3px rgba(14, 31, 28, 0.06);
}
.quicktech-dashboard-tabpanel {
  display: none;
}
.quicktech-dashboard-tabpanel.is-active {
  display: block;
}

/* ---- Badges ---- */
.quicktech-dashboard-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 0.28rem 0.6rem;
  border-radius: 999px;
  white-space: nowrap;
}
.quicktech-dashboard-badge .quicktech-dashboard-icon {
  width: 11px;
  height: 11px;
}
.quicktech-dashboard-badge--success {
  background: #e6f6ec;
  color: #15803d;
}
.quicktech-dashboard-badge--amber {
  background: #fef3e2;
  color: #d97706;
}
.quicktech-dashboard-badge--blood {
  background: #fce6e9;
  color: #d7263d;
}
.quicktech-dashboard-badge--neutral {
  background: #21428a12;
  color: #5f766f;
}
.quicktech-dashboard-badge--teal {
  background: #21428a12;
  color: #21428a;
}
.quicktech-dashboard-badge--blue {
  background: #e3edf9;
  color: #2563a8;
}

/* ==========================================================================
   6. RECORD CARD
   ========================================================================== */
.quicktech-dashboard-recordlist {
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
}
.quicktech-dashboard-recordcard {
  background: #ffffff;
  border: 1px solid #e0ece8;
  border-radius: 14px;
  padding: 1.1rem 1.2rem;
  box-shadow: 0 1px 3px rgba(14, 31, 28, 0.06);
}
.quicktech-dashboard-recordcard__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 0.75rem;
  flex-wrap: wrap;
}
.quicktech-dashboard-recordcard__title-wrap {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.quicktech-dashboard-recordcard__icon {
  width: 38px;
  height: 38px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.quicktech-dashboard-recordcard__icon .quicktech-dashboard-icon {
  width: 18px;
  height: 18px;
}
.quicktech-dashboard-recordcard__title {
  font-weight: 700;
  font-size: 0.95rem;
}
.quicktech-dashboard-recordcard__id {
  font-family: "JetBrains Mono", monospace;
  font-size: 0.72rem;
  color: #5f766f;
}
.quicktech-dashboard-recordcard__summary {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.2rem;
  margin-top: 0.75rem;
  font-size: 0.8rem;
  color: #33453f;
}
.quicktech-dashboard-recordcard__summary span {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}
.quicktech-dashboard-recordcard__summary .quicktech-dashboard-icon {
  width: 13px;
  height: 13px;
  color: #5f766f;
}

.quicktech-dashboard-recordcard__details {
  margin-top: 0.85rem;
  border-top: 1px dashed #e0ece8;
  padding-top: 0.7rem;
}
.quicktech-dashboard-recordcard__details summary {
  cursor: pointer;
  font-size: 0.8rem;
  font-weight: 700;
  color: #21428a;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}
.quicktech-dashboard-recordcard__details summary::-webkit-details-marker {
  display: none;
}
.quicktech-dashboard-recordcard__details summary::before {
  content: "▸";
  font-size: 0.65rem;
  transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
  display: inline-block;
}
.quicktech-dashboard-recordcard__details[open] summary::before {
  transform: rotate(90deg);
}

.quicktech-dashboard-dl {
  margin-top: 0.9rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.quicktech-dashboard-dl__group-title {
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #5f766f;
  margin-bottom: 0.5rem;
  padding-top: 0.7rem;
  border-top: 1px solid #e0ece8;
}
.quicktech-dashboard-dl__group:first-child
  .quicktech-dashboard-dl__group-title {
  border-top: none;
  padding-top: 0;
}
.quicktech-dashboard-dl__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 0.7rem 1rem;
}
.quicktech-dashboard-dl__row dt {
  font-size: 0.7rem;
  color: #5f766f;
}
.quicktech-dashboard-dl__row dd {
  font-size: 0.83rem;
  font-weight: 600;
  margin-top: 0.15rem;
  line-height: 1.35;
}

.quicktech-dashboard-items {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.quicktech-dashboard-items__row {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  font-size: 0.83rem;
  padding: 0.4rem 0;
  border-bottom: 1px solid #e0ece8;
}
.quicktech-dashboard-items__row:last-child {
  border-bottom: none;
}
.quicktech-dashboard-items__name {
  font-weight: 600;
}
.quicktech-dashboard-items__meta {
  font-size: 0.75rem;
  color: #5f766f;
}
.quicktech-dashboard-items__amount {
  font-family: "JetBrains Mono", monospace;
  font-weight: 600;
  white-space: nowrap;
}

.quicktech-dashboard-totals {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  margin-top: 0.6rem;
  font-size: 0.83rem;
}
.quicktech-dashboard-totals__row {
  display: flex;
  justify-content: space-between;
  color: #5f766f;
}
.quicktech-dashboard-totals__row--total {
  color: #0e1f1c;
  font-weight: 700;
  font-size: 0.92rem;
  border-top: 1px solid #e0ece8;
  padding-top: 0.4rem;
  margin-top: 0.2rem;
}
.quicktech-dashboard-totals__row--total span:last-child {
  font-family: "JetBrains Mono", monospace;
}

/* ---- Progress bar ---- */
.quicktech-dashboard-progress {
  height: 7px;
  border-radius: 999px;
  background: #21428a12;
  overflow: hidden;
}
.quicktech-dashboard-progress__bar {
  height: 100%;
  border-radius: 999px;
  background: #14b8a6;
}
.quicktech-dashboard-progress__bar--blood {
  background: #d7263d;
}

/* ---- Notifications ---- */
.quicktech-dashboard-notif {
  display: flex;
  gap: 0.75rem;
  padding: 0.85rem 1.3rem;
  border-top: 1px solid #e0ece8;
}
.quicktech-dashboard-notif:first-child {
  border-top: none;
}
.quicktech-dashboard-notif__icon {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.quicktech-dashboard-notif__icon .quicktech-dashboard-icon {
  width: 16px;
  height: 16px;
}
.quicktech-dashboard-notif__title {
  font-size: 0.83rem;
  font-weight: 600;
  line-height: 1.3;
}
.quicktech-dashboard-notif__time {
  font-size: 0.72rem;
  color: #5f766f;
  margin-top: 0.15rem;
}
.quicktech-dashboard-notif--unread {
  background: #f4faf8;
}

/* ---- Profile completion ---- */
.quicktech-dashboard-ring-wrap {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.quicktech-dashboard-ring {
  transform: rotate(-90deg);
  flex-shrink: 0;
}
.quicktech-dashboard-ring__track {
  fill: none;
  stroke: #21428a12;
  stroke-width: 8;
}
.quicktech-dashboard-ring__value {
  fill: none;
  stroke: #14b8a6;
  stroke-width: 8;
  stroke-linecap: round;
}

/* ---- Empty state ---- */
.quicktech-dashboard-empty {
  text-align: center;
  padding: 2.5rem 1.5rem;
  color: #5f766f;
}
.quicktech-dashboard-empty .quicktech-dashboard-icon {
  width: 34px;
  height: 34px;
  margin: 0 auto 0.8rem;
  color: #9ab0a9;
}
.quicktech-dashboard-empty__title {
  font-weight: 700;
  color: #0e1f1c;
  font-size: 0.92rem;
  margin-bottom: 0.3rem;
}
.quicktech-dashboard-empty__desc {
  font-size: 0.82rem;
  max-width: 34ch;
  margin: 0 auto;
}

/* ==========================================================================
   7. FLOATING QUICK-LINKS BUTTON
   ========================================================================== */
.quicktech-dashboard-fab {
  position: fixed;
  right: 2rem;
  bottom: 2rem;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #21428a;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 28px -8px rgba(15, 110, 100, 0.18);
  z-index: 37;
  transition:
    transform 180ms cubic-bezier(0.4, 0, 0.2, 1),
    background 180ms cubic-bezier(0.4, 0, 0.2, 1);
}
.quicktech-dashboard-fab:hover {
  background: #21428a;
}
.quicktech-dashboard-fab .quicktech-dashboard-icon {
  width: 24px;
  height: 24px;
  transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1);
}
.quicktech-dashboard-fab.is-open .quicktech-dashboard-icon {
  transform: rotate(45deg);
}
.quicktech-dashboard-fab-menu {
  position: fixed;
  right: 2rem;
  bottom: 5.5rem;
  background: #ffffff;
  border: 1px solid #e0ece8;
  border-radius: 14px;
  box-shadow: 0 10px 28px -8px rgba(15, 110, 100, 0.18);
  padding: 0.5rem;
  display: none;
  flex-direction: column;
  gap: 0.15rem;
  z-index: 36;
  min-width: 236px;
}
.quicktech-dashboard-fab-menu.is-open {
  display: flex;
}
.quicktech-dashboard-fab-menu__note {
  font-size: 0.68rem;
  color: #5f766f;
  padding: 0.5rem 0.7rem 0.3rem;
}
.quicktech-dashboard-fab-menu a {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.6rem 0.7rem;
  border-radius: 8px;
  font-size: 0.84rem;
  font-weight: 600;
  color: #33453f;
}
.quicktech-dashboard-fab-menu a:hover {
  background: #21428a12;
}
.quicktech-dashboard-fab-menu a .quicktech-dashboard-icon {
  width: 16px;
  height: 16px;
  color: #128577;
}

/* ==========================================================================
   8. RESPONSIVE
   ========================================================================== */
@media (max-width: 1180px) {
  .quicktech-dashboard-stats {
    grid-template-columns: repeat(2, 1fr);
  }
  .quicktech-dashboard-quicklinks {
    grid-template-columns: repeat(2, 1fr);
  }
  .quicktech-dashboard-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 900px) {
  .quicktech-dashboard-sidebar {
    transform: translateX(-100%);
    /* box-shadow: 0 0 40px rgba(0, 0, 0, 0.35); */
  }
  .quicktech-dashboard-sidebar.is-open {
    transform: translateX(0);
  }
  .quicktech-dashboard-sidebar__close {
    display: flex;
  }
  .quicktech-dashboard-sidebar-backdrop {
    display: block;
  }
  .quicktech-dashboard-main {
    margin-left: 0;
  }
  .quicktech-dashboard-topbar__menu-btn {
    display: flex;
  }
  .quicktech-dashboard-welcome__meta {
    gap: 1rem;
  }
  .quicktech-dashboard-search {
    max-width: none;
  }
}
@media (max-width: 640px) {
  .quicktech-dashboard-stats,
  .quicktech-dashboard-quicklinks {
    grid-template-columns: 1fr;
  }
  .quicktech-dashboard-content {
    padding: 1.1rem;
  }
  .quicktech-dashboard-userchip__name,
  .quicktech-dashboard-userchip__role {
    display: none;
  }
  .quicktech-dashboard-callbtn span {
    display: none;
  }
  .quicktech-dashboard-dl__grid {
    grid-template-columns: 1fr 1fr;
  }
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
summary:focus-visible {
  outline: 2px solid #14b8a6;
  outline-offset: 2px;
}


.quicktech-edit-btn button{
  font-size: 14px;
  font-weight: 600;
  color: red;
}


/* blog details */

.quicktech-blogdetails-wrapper {
  background-color: #f9fafb;
  padding-top: 40px;
  padding-bottom: 60px;
}

.quicktech-blogdetails-breadcrumb {
  font-size: 0.9rem;
}

.quicktech-blogdetails-badge {
  font-weight: 500;
}

.quicktech-blogdetails-title {
  
  color: #111827;
  line-height: 1.3;
}

.quicktech-blog-p-thumb img{
  max-width: 100%;
  display: block;
  width: 100%;
  height: 100%;
}

.quicktech-blogdetails-meta {

  font-size: 0.95rem;
}

.quicktech-blogdetails-avatar {
  width: 35px;
  height: 35px;
  font-size: 13px;
  background-color: #e0e7ff;
  color: #4338ca;
  font-weight: 700;
}

.quicktech-blogdetails-featured-img {
  max-height: 550px;
  object-fit: cover;
}

/* Typography inside the article body */
.quicktech-blogdetails-body p {
 
  font-size: 1.1rem;
  line-height: 1.8;
  color: #4b5563;
  margin-bottom: 1.5rem;
}

.quicktech-blogdetails-body .quicktech-blogdetails-lead {
  font-size: 1.25rem;
  color: #374151;
  font-weight: 500;
}

.quicktech-blogdetails-body h2,
.quicktech-blogdetails-body h3 {

  color: #1f2937;
  font-weight: 600;
  margin-top: 2.5rem;
  margin-bottom: 1rem;
}

.quicktech-blogdetails-body ul li {
  font-family: 'Open Sans', sans-serif;
  font-size: 1.1rem;
  line-height: 1.8;
  color: #4b5563;
  margin-bottom: 0.5rem;
}

.quicktech-blogdetails-blockquote {
  font-style: italic;
  font-size: 1.2rem;
  color: #1e40af;
}

/* Tags and Share section */
.quicktech-blogdetails-label {
  color: #374151;
}

.quicktech-blogdetails-share-btn {
  width: 35px;
  height: 35px;
  transition: all 0.3s ease;
}

.quicktech-blogdetails-share-btn:hover {
  background-color: #6c757d;
  color: #ffffff;
}

/* blog details */


/* invoice */
.quicktech-invoice-wrapper {
	/* font-family: 'Poppins', sans-serif; */
	background-color: #21428a12;
	padding: 40px 20px;
	display: flex;
	justify-content: center;
	color: #333;
	max-width: 700px;
	margin: auto;
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
  border-radius: 10px;
}


  /* Header area */
  .quicktech-invoice-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    border-bottom: 2px solid #e5e7eb;
    padding-bottom: 20px;
    margin-bottom: 30px;
  }

  .quicktech-invoice-brand h2 {
    margin: 0;
    color: #1d4ed8;
    font-size: 28px;
    font-weight: 700;
    letter-spacing: 1px;
  }

  .quicktech-invoice-brand p {
    margin: 5px 0 0;
    font-size: 13px;
    color: #6b7280;
  }

  .quicktech-invoice-meta {
    text-align: right;
  }

  .quicktech-invoice-title {
    margin: 0 0 10px;
    font-size: 24px;
    text-transform: uppercase;
    color: #111827;
    letter-spacing: 2px;
  }

  .quicktech-invoice-meta p {
    margin: 4px 0;
    font-size: 14px;
    color: #4b5563;
  }

  .quicktech-invoice-meta span {
    font-weight: 600;
    color: #111827;
  }

  /* Address Section */
  .quicktech-invoice-addresses {
    display: flex;
    justify-content: space-between;
    margin-bottom: 30px;
    gap: 20px;
  }

  .quicktech-invoice-address-box {
    flex: 1;
    background-color: #f9fafb;
    padding: 15px 20px;
    border-radius: 6px;
    border: 1px solid #e5e7eb;
  }

  .quicktech-invoice-address-box h3 {
    margin: 0 0 10px;
    font-size: 14px;
    text-transform: uppercase;
    color: #9ca3af;
    letter-spacing: 1px;
  }

  .quicktech-invoice-address-box p {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
    color: #374151;
  }

  .quicktech-invoice-address-box strong {
    color: #111827;
    display: block;
    margin-bottom: 4px;
  }

  /* Table */
  .quicktech-invoice-table-wrapper {
    width: 100%;
    overflow-x: auto;
    margin-bottom: 30px;
  }

  .quicktech-invoice-table {
    width: 100%;
    border-collapse: collapse;
    text-align: left;
  }

  .quicktech-invoice-table th {
    background-color: #1d4ed8;
    color: #ffffff;
    padding: 12px 15px;
    font-size: 14px;
    font-weight: 500;
  }

  .quicktech-invoice-table td {
    padding: 15px;
    border-bottom: 1px solid #e5e7eb;
    font-size: 14px;
    color: #4b5563;
  }

  .quicktech-invoice-table th:last-child,
  .quicktech-invoice-table td:last-child {
    text-align: right;
  }

  .quicktech-invoice-item-name {
    font-weight: 600;
    color: #111827;
    display: block;
  }

  .quicktech-invoice-item-meta {
    font-size: 12px;
    color: #6b7280;
    margin-top: 4px;
  }

  /* Summary Section */
  .quicktech-invoice-summary-section {
    display: flex;
    justify-content: space-between;
    gap: 30px;
  }

  .quicktech-invoice-notes {
    flex: 1;
    font-size: 13px;
    color: #6b7280;
  }

  .quicktech-invoice-notes h4 {
    margin: 0 0 8px;
    color: #374151;
    text-transform: uppercase;
    font-size: 12px;
  }

  .quicktech-invoice-notes p {
    margin: 0 0 15px;
    line-height: 1.5;
  }

  .quicktech-invoice-totals {
    flex: 0 0 300px;
  }

  .quicktech-invoice-total-row {
    display: flex;
    justify-content: space-between;
    padding: 8px 0;
    font-size: 14px;
    color: #4b5563;
  }

  .quicktech-invoice-total-row.quicktech-invoice-discount {
    color: #ef4444; /* Red for discount */
  }

  .quicktech-invoice-grand-total {
    border-top: 2px solid #e5e7eb;
    margin-top: 10px;
    padding-top: 15px;
    font-size: 18px;
    font-weight: 700;
    color: #111827;
  }

  /* Footer */
  .quicktech-invoice-footer {
    margin-top: 40px;
    text-align: center;
    padding-top: 20px;
    border-top: 1px solid #e5e7eb;
  }

  .quicktech-invoice-footer p {
    margin: 0;
    font-size: 14px;
    color: #6b7280;
    font-weight: 500;
  }

  /* Responsive */
  @media (max-width: 650px) {
    .quicktech-invoice-header,
    .quicktech-invoice-addresses,
    .quicktech-invoice-summary-section {
      flex-direction: column;
    }
    
    .quicktech-invoice-meta {
      text-align: left;
      margin-top: 20px;
    }

    .quicktech-invoice-totals {
      width: 100%;
      flex: 1;
      margin-top: 20px;
    }
    
    .quicktech-invoice-container {
      padding: 20px;
    }
  }


/* invoice */

.anasna{
  display: flex;
  align-items: center;
  justify-content: end;
}

/* Position the container so the menu anchors to it */
.quicktech-dashboard-dropdown-container {
  position: relative;
  display: inline-block;
}

/* Hide the menu by default and style it */
.quicktech-dashboard-dropdown-menu {
  display: none;
  position: absolute;
  right: 0; /* Aligns the menu to the right edge of the button */
  top: 100%;
  margin-top: 8px;
  background-color: #ffffff;
  min-width: 160px;
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.15);
  border-radius: 6px;
  z-index: 100;
  overflow: hidden;
  border: 1px solid #eaeaea;
}

/* Class added via JavaScript to show the menu */
.quicktech-dashboard-dropdown-menu.show {
  display: block;
}

/* Style the links inside the menu */
.quicktech-dropdown-item {
  color: #333333;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  font-size: 14px;
}

/* Hover effect for the links */
.quicktech-dropdown-item:hover {
  background-color: #f5f5f5;
}




/* Notification Panel Override */
.quicktech-notification-panel {
  width: 320px; /* Wider than the profile menu */
  padding: 0;   /* Remove default padding to allow edge-to-edge design */
  right: -10px; /* Adjust slightly depending on your header layout */
}

/* Header */
.quicktech-notification-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px;
  border-bottom: 1px solid #eaeaea;
}

.quicktech-notification-title {
  font-weight: 600;
  font-size: 14px;
  color: #111827;
}

.quicktech-notification-mark-read {
  background: none;
  border: none;
  font-size: 12px;
  color: #3b82f6;
  cursor: pointer;
  padding: 0;
}

.quicktech-notification-mark-read:hover {
  text-decoration: underline;
}

/* Scrollable List */
.quicktech-notification-list {
  max-height: 300px;
  overflow-y: auto;
}

/* Individual Notification Item */
.quicktech-notification-item {
  display: flex;
  align-items: flex-start;
  padding: 12px 16px;
  text-decoration: none;
  border-bottom: 1px solid #f3f4f6;
  transition: background-color 0.2s;
  position: relative;
}

.quicktech-notification-item:hover {
  background-color: #f9fafb;
}

/* Unread State */
.quicktech-notification-item.unread {
  background-color: #f0f7ff;
}

.quicktech-notification-item.unread:hover {
  background-color: #e5f0fa;
}

.quicktech-notification-unread-dot {
  width: 8px;
  height: 8px;
  background-color: #3b82f6;
  border-radius: 50%;
  margin-top: 4px;
  flex-shrink: 0;
}

/* Icons / Avatars */
.quicktech-notification-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-right: 12px;
}

/* Text Content */
.quicktech-notification-content {
  flex-grow: 1;
  padding-right: 8px;
}

.quicktech-notification-text {
  margin: 0;
  font-size: 13px;
  color: #374151;
  line-height: 1.4;
}

.quicktech-notification-time {
  font-size: 11px;
  color: #6b7280;
  margin-top: 4px;
  display: block;
}

/* Footer */
.quicktech-notification-footer {
  display: block;
  text-align: center;
  padding: 12px;
  font-size: 13px;
  font-weight: 500;
  color: #3b82f6;
  text-decoration: none;
  background-color: #f9fafb;
  border-top: 1px solid #eaeaea;
}

.quicktech-notification-footer:hover {
  background-color: #f3f4f6;
}


.quicktech-appointment-set-emergency-banner {
	margin-top: 16px;
	background-color: #21428a12;
	border-radius: 8px;
	padding: 12px 16px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	font-size: 13px;
	color: #21428a;
	flex-direction: column;
}




.quicktech-every-header.quicktech-every {
    display: flex;
    align-items: center;
    margin-bottom: 22px;
    cursor: pointer;
  }

  /* Native Checkbox styling */
.quicktech-every-checkbox.quicktech-every {
	appearance: none;
	-webkit-appearance: none;
	width: 17px;
	height: 17px;
	background-color: #21428a;
	border: none;
	border-radius: 6px;
	margin: 0 6px 0 0;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	position: relative;
	flex-shrink: 0;
}

  /* Thick SVG Checkmark mapped directly to the checked state */
  .quicktech-every-checkbox.quicktech-every:checked {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='19 7 9.5 16.5 5 12'%3E%3C/polyline%3E%3C/svg%3E");
    background-size: 18px;
    background-position: center;
    background-repeat: no-repeat;
  }

 .quicktech-every-title.quicktech-every {
	font-size: 12px;
	font-weight: 500;
	color: #111827e0;
	letter-spacing: 0.2px;
}

.quicktech-every-text.quicktech-every {
	font-size: 13px;
	color: #6b7280;
	line-height: 1.55;
	margin: 0 0 16px 0;
	letter-spacing: 0.1px;
}

  .quicktech-every-footer.quicktech-every {
    font-size: 18px;
    color: #6b7280;
    line-height: 1.55;
    margin: 36px 0 0 0;
    letter-spacing: 0.1px;
  }

  .quicktech-every-link.quicktech-every {
    color: #21428a;
    text-decoration: none;
    font-weight: 500;
  }

  .quicktech-every-link.quicktech-every:hover {
    text-decoration: underline;
  }


  /* 1. Hide the text div by default */
.every-text {
  display: none;
}

/* 2. Show the text div ONLY when the checkbox inside the container is checked */
.quicktech-every-container:has(.quicktech-every-checkbox:checked) .every-text {
  display: block;
}



/* ============================================================
   QuikCTech - Nurse Application Form Modern Styling
   ============================================================ */

/* Main Container & Layout */
.container.quikctech-apply-jobs {
  max-width: 860px;
  margin-top: 2rem !important;
  margin-bottom: 3rem !important;
}

.card.quikctech-apply-jobs {
  border: none !important;
  border-radius: 16px !important;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.08), 0 2px 6px rgba(15, 23, 42, 0.04) !important;
  background-color: #ffffff;
  overflow: hidden;
}

/* Card Header */
.card-header.quikctech-apply-jobs {
  background: linear-gradient(135deg, #0284c7 0%, #0f766e 100%) !important;
  padding: 1.5rem 2rem !important;
  border-bottom: none !important;
}

.card-header.quikctech-apply-jobs h3 {
  font-weight: 700;
  letter-spacing: -0.3px;
  font-size: 1.5rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.card-body.quikctech-apply-jobs {
  padding: 2.25rem !important;
}

/* Section Headings */
h5.quikctech-apply-jobs {
  color: #0f172a !important;
  font-weight: 700 !important;
  font-size: 1.1rem !important;
  letter-spacing: -0.2px;
  display: flex;
  align-items: center;
  position: relative;
  padding-left: 0.75rem;
}

h5.quikctech-apply-jobs::before {
  content: "";
  position: absolute;
  left: 0;
  top: 15%;
  height: 70%;
  width: 4px;
  background-color: #0f766e;
  border-radius: 4px;
}

/* Form Labels */
.form-label.quikctech-apply-jobs {
  font-size: 0.875rem;
  font-weight: 600;
  color: #334155;
  margin-bottom: 0.4rem;
}

/* Form Controls (Inputs, Selects, Textareas) */
.form-control.quikctech-apply-jobs,
.form-select.quikctech-apply-jobs {
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 10px !important;
  padding: 0.65rem 0.9rem !important;
  font-size: 0.95rem;
  color: #1e293b;
  background-color: #f8fafc;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.form-control.quikctech-apply-jobs:hover,
.form-select.quikctech-apply-jobs:hover {
  background-color: #ffffff;
  border-color: #94a3b8 !important;
}

.form-control.quikctech-apply-jobs:focus,
.form-select.quikctech-apply-jobs:focus {
  background-color: #ffffff !important;
  border-color: #0284c7 !important;
  box-shadow: 0 0 0 4px rgba(2, 132, 199, 0.15) !important;
  outline: none;
}

/* Custom File Upload Input */
input[type="file"].form-control.quikctech-apply-jobs {
  padding: 0.45rem 0.75rem !important;
  background-color: #ffffff;
  cursor: pointer;
}

input[type="file"].form-control.quikctech-apply-jobs::file-selector-button {
  background-color: #e0f2fe;
  color: #0369a1;
  border: none;
  border-radius: 6px;
  padding: 0.35rem 0.75rem;
  font-weight: 600;
  font-size: 0.85rem;
  margin-right: 0.75rem;
  transition: background-color 0.2s ease;
}

input[type="file"].form-control.quikctech-apply-jobs::file-selector-button:hover {
  background-color: #bae6fd;
}

/* Certificate Dynamic Cards */
.cert-row.quikctech-apply-jobs {
  background-color: #f8fafc;
  border: 1px dashed #cbd5e1;
  padding: 0.85rem;
  border-radius: 10px;
  transition: border-color 0.2s ease;
}

.cert-row.quikctech-apply-jobs:hover {
  border-color: #0f766e;
}

/* Custom Buttons */
.btn-primary.quikctech-apply-jobs {
  background: linear-gradient(135deg, #0284c7 0%, #0369a1 100%) !important;
  border: none !important;
  border-radius: 10px !important;
  font-weight: 600;
  letter-spacing: 0.2px;
  padding: 0.85rem 1.5rem !important;
  box-shadow: 0 4px 12px rgba(2, 132, 199, 0.25);
  transition: all 0.2s ease !important;
}

.btn-primary.quikctech-apply-jobs:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(2, 132, 199, 0.35);
  background: linear-gradient(135deg, #0369a1 0%, #075985 100%) !important;
}

.btn-primary.quikctech-apply-jobs:active {
  transform: translateY(0);
}

.btn-outline-secondary.quikctech-apply-jobs {
  border: 1.5px dashed #0f766e !important;
  color: #0f766e !important;
  font-weight: 600;
  border-radius: 8px !important;
  padding: 0.4rem 1rem !important;
  transition: all 0.2s ease;
}

.btn-outline-secondary.quikctech-apply-jobs:hover {
  background-color: #f0fdf4 !important;
  border-style: solid !important;
  color: #047857 !important;
}

.btn-outline-danger.quikctech-apply-jobs {
  border-radius: 8px !important;
  font-weight: 600;
  border-width: 1.5px !important;
}

/* Checkbox & Dividers */
.form-check-input.quikctech-apply-jobs {
  width: 1.15em;
  height: 1.15em;
  border: 1.5px solid #cbd5e1;
  border-radius: 4px;
}

.form-check-input.quikctech-apply-jobs:checked {
  background-color: #0f766e;
  border-color: #0f766e;
}

hr.quikctech-apply-jobs {
  border-top: 1px solid #e2e8f0;
  opacity: 1;
}

/* Mobile Polish */
@media (max-width: 576px) {
  .card-body.quikctech-apply-jobs {
    padding: 1.25rem !important;
  }
  .card-header.quikctech-apply-jobs {
    padding: 1.25rem !important;
  }
}



/* Container for desktop positioning */
.quicktech-floating-wrapper {
  position: fixed;
  bottom: 24px;
  right: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  z-index: 9999;
}

/* Button Base Styles */
.quicktech-floating-btn {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  text-decoration: none;
}

.quicktech-floating-btn:hover {
  transform: translateY(-4px) scale(1.05);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35);
}

/* Colors */
.quicktech-whatsapp {
  background-color: #25d366;
}

.quicktech-call {
  background-color: #007bff;
}

/* Flaticon Sizing */
.quicktech-floating-icon {
  font-size: 26px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Responsive Styles for Mobile */
@media (max-width: 900px) {
 .quicktech-floating-wrapper {
	bottom: 78px;
	right: 16px;
	gap: 10px;
}

  .quicktech-floating-btn {
    width: 48px;
    height: 48px;
  }

  .quicktech-floating-icon {
    font-size: 22px;
  }
}




.marquee-container {
	width: 100%;
	overflow: hidden;
	background-color: #21428a12;
	padding: 12px 0;
	white-space: nowrap;
	user-select: none;
}

    /* Animation Track */
    .marquee-track {
      display: flex;
      width: max-content;
      animation: scroll 30s linear infinite;
    }

    /* Pause animation on hover for readability */
    .marquee-container:hover .marquee-track {
      animation-play-state: paused;
    }

    /* Text Group */
    .marquee-content {
      display: flex;
      align-items: center;
      gap: 4.5rem;          /* Wide spacing between items */
      padding-right: 4.5rem;
    }

    /* Item Typography */
    .marquee-item {
      color: black;
      font-size: 13px;
      font-weight: 500;
      letter-spacing: 2px; /* Matching wide letter-spacing */
      text-transform: uppercase;
    }

    /* Smooth Infinite Loop Keyframe */
    @keyframes scroll {
      0% {
        transform: translateX(0);
      }
      100% {
        transform: translateX(-50%);
      }
    }