/* Tender Section Base */
/* .tender-section {
  background-color: #F5F1EE;
} */

#main-wazir {
  background-color: #F5F1EE;
}

/* --- Scoped Breadcrumb Section --- */

/* Breadcrumb Links */
.sop-breadcrumb-section .breadcrumb {
  padding: 0;
  margin: 0;
  background: transparent;
}

.sop-breadcrumb-section .breadcrumb-item {
  font-size: 14px;
  display: flex;
  align-items: center;
}

.sop-breadcrumb-section .breadcrumb-item a {
  color: #327458;
  text-decoration: none;
  font-weight: 400;
}

.sop-breadcrumb-section .breadcrumb-item.active {
  color: #333333;
}

/* Custom Separator (The Arrow/Chevron) */
.sop-breadcrumb-section .breadcrumb-item + .breadcrumb-item::before {
  content: "\f054"; /* FontAwesome Chevron-right */
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-size: 10px;
  color: #333;
  padding-left: 15px;
  padding-right: 15px;
  float: none; /* Fixes Bootstrap default alignment */
}

/* Right Side Contact Link */
.sop-breadcrumb-section .breadcrumb-action a {
  color: #327458;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
}

.sop-breadcrumb-section .breadcrumb-action a:hover {
  text-decoration: underline;
}

/* Responsive Gutter Adjustment */
@media (max-width: 991px) {
  .sop-breadcrumb-section .container-fluid {
    padding-inline: 1.5rem !important;
  }
}
@media (max-width: 768px) {
  .sop-breadcrumb-section .container-fluid {
    padding-inline: 1.5rem !important;
  }
  .sop-breadcrumb-section {
    display: none;
  }
}

/* --------------------------------------------------------- */
     .tenders-section {
             background-color:  #f9f9f9;
        }


/* Hero */
.tender-section .hero {
  background-image:
    linear-gradient(rgba(0, 0, 0, 0.2), rgba(82, 117, 223, 0.2)),
    url("/assets/images/tenderbg.png"); /* change image if needed */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 40px 0;
  color: #ffffff;
}

@media (min-width: 768px) {
  .tender-section .hero {
    padding: 60px 0;
  }
}

/* Responsive Padding – scoped to Tender */
.tender-section .responsive-padding {
  padding-inline: 1.25rem;
}

@media (max-width: 991px) {
  .tender-section .responsive-padding {
    padding-inline: 1.5rem;
  }
}

@media (max-width: 768px) {
  .tender-section .responsive-padding {
    padding-inline: 1.5rem;
  }
}

/* Hero Heading */
.tender-section .hero h1 {
  font-size: calc(1.5rem + 1.5vw);
  font-weight: 500;
  margin-bottom: 0.8rem;
}


    /* .tenders-section { background:#f9f9f9; } */

    .tenders-section-title {
      font-family:'Hanken Grotesk',sans-serif;
      font-size:clamp(28px,6vw,36px);
    }

    .tender-tabs a {
      font-family:'Inter',sans-serif;
      font-weight:700;
      padding:8px 15px;
      border-radius:25px;
      text-decoration:none;
      display:inline-block;
    }

    .tender-tab-active {
      background:#327458;
      color:#fff;
    }

    .tender-tab-inactive {
      background:#EEEEEE;
      color:#333;
    }

    /* .tender-search-input {
      max-width:200px;
    } */
        /* Search Input Styling */
        .tender-search-input {
            border: 1px solid #ccc;
            border-radius: 4px;
            width: 100%;
        }
          @media (min-width: 768px) { 
        .tender-search-input {
            width: 200px;
        }
    }
        .tender-search-input:focus {
            border-color: #327458;
            box-shadow: 0 0 4px rgba(50, 116, 88, 0.3);
            outline: none;
        }

    /* .tender-card {
      background:#FFF3CD;
      box-shadow:0 4px 10px #0000000D;
    } */
      /* Tender Card Container: Padding is fine via p-4 */

        /* 4. Tender Heading: Uses clamp */
        .tender-card-heading {
            font-family: 'Hanken Grotesk', sans-serif;
            font-weight: 400;
            color: #333333;
            font-size: clamp(20px, 5vw, 36px);
            line-height: 1.3;
            margin-bottom: 15px;
        }

        /* 5. Tender Paragraph/Description: Fixed size is fine for body text */
        .tender-card-text {
            font-family: 'Poppins', sans-serif;
            font-weight: 400;
            font-size: clamp(14px, 4vw, 16px);
            line-height: 1.3;
            color: #333333;
            margin-bottom: 15px;
        }

        /* 6. Start/End Dates: Fixed size is fine for important data */
        .tender-card-dates {
            font-family: 'Poppins', sans-serif;
            font-weight: 700;
            font-size: clamp(16px, 4vw, 18px);
            line-height: 1.3;
            color: #000000;
            margin-bottom: 15px;
        }

        /* 7. 'View / Download' Button: Fixed size is fine */
        .tender-card-btn {
            display: inline-block;
            background: #327458;
            color: #FFFFFF;
            font-family: 'Poppins', sans-serif;
            font-weight: 500;
            font-size: 16px;
            line-height: 20.8px;
            padding: 8px 15px;
            border-radius: 4px;
            text-decoration: none;
        }

#site-header .container-fluid, 
#footer-sop .container-fluid {
    max-width: 1350px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}