:root {
    --primary-color: #fa7d09;
    --primary-hover-color: #ffa550;
    --secondary-color: #4a4a4a;
    --background-color: #f8f7ff;
    --white-color: white;
    --dropdown-hover-background-color: #f8f9fa;
    --navbar-shadow-color: rgba(0, 0, 0, 0.1);
    --navbar-scroll-color: #e2e0ea;
    --orange-color: #fa7d09;
  }
  
  * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }
  
  .job-navbar {
    background-color: var(--background-color);
    /* padding: 15px 0; */
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 999 !important;
    transition: all 0.5s ease;
  }
  
  .job-navbar.scrolled {
    background-color: var(--navbar-scroll-color);
    box-shadow: 0 2px 10px var(--navbar-shadow-color);
  }
  
  .job-navbar .navbar-brand img {
    height: 80px;
    width: auto;
  }
  
  .job-navbar .navbar-nav .nav-link {
    color: var(--secondary-color);
    font-weight: 500;
    padding: 0.5rem 1.5rem !important;
    position: relative;
  }
  
  .job-navbar .navbar-nav .nav-link i {
    font-size: 10px;
  }
  
  .job-navbar .navbar-nav .nav-link:hover {
    color: var(--primary-color) !important;
  }
  
  /* Dropdown styles */
  .job-navbar .dropdown-menu {
    display: none;
    background-color: var(--white-color);
    border: none;
    border-radius: 4px;
    box-shadow: 0 2px 10px var(--navbar-shadow-color);
    margin-top: 0;
  }
  
  .job-navbar .dropdown:hover .dropdown-menu {
    display: block;
  }
  
  .job-navbar .dropdown-item {
    color: var(--secondary-color);
    padding: 8px 16px;
  }
  
  .job-navbar .dropdown-item:hover {
    background-color: var(--dropdown-hover-background-color);
    color: var(--primary-color);
  }
  
  /* Auth buttons */
  .job-navbar .sign-in {
    color: var(--secondary-color);
    text-decoration: none;
    font-weight: 500;
    padding: 8px 16px;
    border-radius: 40px;
    transition: color 0.3s ease;
    border: 1px solid var(--primary-color);
  }
  
  .job-navbar .sign-in:hover {
    color: var(--primary-color);
  }
  
  .job-navbar .register {
    background-color: var(--primary-color);
    color: var(--white-color);
    text-decoration: none;
    padding: 10px 24px;
    border-radius: 40px;
    font-weight: 500;
    transition: background-color 0.3s ease;
    border: none;
  }
  
  .job-navbar .register:hover {
    background-color: var(--primary-hover-color);
    color: var(--white-color);
  }
  
  /* Mobile menu */
  @media (max-width: 991.98px) {
    .job-navbar .navbar-collapse {
      background-color: var(--white-color);
      padding: 1rem;
      border-radius: 4px;
      box-shadow: 0 2px 10px var(--navbar-shadow-color);
    }
  
    .job-navbar .dropdown-menu {
      border: none;
      box-shadow: none;
      padding-left: 1rem;
    }
  
    .job-navbar .navbar-nav .nav-item {
      padding: 0.5rem 0;
    }
  
    .job-navbar .auth-buttons {
      flex-direction: column;
      gap: 10px;
      padding: 1rem 0;
    }
  
    .job-navbar .sign-in {
      display: block;
      text-align: center;
    }
  
    .job-navbar .register {
      display: block;
      text-align: center;
    }
  }
  
  /* hero-section */
  
  /* Hero Section */
  .hero-section {
    padding-top: 120px;
    padding-bottom: 10px;
    background-color: var(--background-color);
    position: relative;
  }
  
  .hero-title {
    font-size: 60px;
    font-weight: 600;
    color: var(--secondary-color);
    margin-bottom: 16px;
  }
  
  .hero-subtitle {
    font-size: 18px;
    color: var(--secondary-color);
    margin-bottom: 32px;
  }
  
  /* Search Form */
  .search-form {
    /* background: var(--white-color); */
    padding: 24px;
    /* box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1); */
    margin-bottom: 30px;
  }
  
  .form-select {
    padding: 12px;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
  }
  .form-select:focus {
    box-shadow: none !important;
    border-color: var(--orange-color);
  }
  
  .find-job-btn {
    background-color: var(--orange-color);
    border: none;
    padding: 12px;
    border-radius: 40px;
    color: var(--white-color);
    font-weight: 500;
  }
  
  .find-job-btn:hover {
    background-color: var(--primary-hover-color);
  }
  
  /* Supported Companies */
  .supported-companies {
    margin-top: 30px;
  }
  
  .supported-text {
    color: var(--secondary-color);
    font-size: 16px;
    margin-bottom: 20px;
  }
  
  .company-count {
    color: var(--orange-color);
    font-weight: 600;
  }
  
  .company-logos {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 32px;
    margin-top: 40px;
  }
  
  .company-logo {
    height: 28px;
    width: auto;
    opacity: 0.7;
    transition: opacity 0.3s ease;
    filter: brightness(100%) contrast(110%) saturate(0%) blur(0px)
      hue-rotate(0deg);
  }
  
  .company-logo:hover {
    opacity: 1;
  }
  
  /* Background Image Section */
  .job-bg-section {
    text-align: center;
    position: relative;
    z-index: 1;
  }
  
  .job-bg-image {
    width: 100%;
    height: auto;
  }
  
  .btn:focus {
    background: var(--orange-color) !important;
    color: #4a4a4a !important;
    box-shadow: none !important;
  }
  
  /* How you will be hired Section */
  .hired-section {
    padding: 60px;
    border-radius: 20px;
    margin: -100px auto 100px;
    position: relative;
    z-index: 2;
  }
  
  .hired-title {
    font-size: 45px;
    font-weight: 600;
    color: var(--secondary-color);
    margin-bottom: 16px;
  }
  
  .hired-subtitle {
    font-size: 18px;
    color: var(--secondary-color);
    margin-bottom: 40px;
  }
  
  .hired-step {
    text-align: center;
    padding: 20px;
    border: 1px solid #e3e7e7;
    border-radius: 20px;
    transition: 0.5s ease;
  }
  .hired-step:hover {
    background: #e3e7e7;
  }
  
  .step-icon {
    width: 84px;
    height: 84px;
    margin: 0 auto 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--background-color);
    border-radius: 50%;
  }
  
  .step-icon img {
    width: 42px;
    height: 42px;
  }
  
  .hired-step h3 {
    font-size: 20px;
    font-weight: 600;
    color: var(--secondary-color);
    margin-bottom: 12px;
  }
  
  .hired-step p {
    font-size: 14px;
    color: var(--secondary-color);
    opacity: 0.8;
  }
  
  /* Responsive Styles */
  
  @media (max-width: 991.98px) {
    .hero-title {
      font-size: 36px;
    }
  
    .company-logos {
      flex-wrap: wrap;
      gap: 20px;
    }
  
    .hired-step {
      margin-bottom: 32px;
    }
  }
  
  @media (max-width: 767.98px) {
    .hero-title {
      font-size: 28px;
    }
  
    .search-form {
      padding: 16px;
    }
  
    .company-logos {
      gap: 16px;
    }
  
    .company-logo {
      height: 20px;
    }
  }
  
  @media (max-width: 575.98px) {
    .hero-section {
      padding-top: 100px;
    }
  
    .hero-title {
      font-size: 24px;
    }
  
    .hero-subtitle {
      font-size: 16px;
    }
  
    .search-form {
      padding: 12px;
    }
  
    .company-logos {
      gap: 12px;
    }
  
    .company-logo {
      height: 16px;
    }
    .hired-section{
      padding: 20px;
      background: #000;
    }
  }
  
  .hr-divider {
    border: none;
    border-bottom: 1px solid #969898;
  }
  
  /* top rated section */
  
  /* Top Rated Section Styles */
  .top-rated-section {
    padding: 80px 0px;
    background-color: #fcfcfc;
  }
  
  .section-title {
    font-size: 42px;
    font-weight: 600;
    color: var(--secondary-color);
    margin-bottom: 8px;
  }
  
  .section-subtitle {
    font-size: 16px;
    color: var(--secondary-color);
    margin-bottom: 0;
  }
  
  .see-all-link {
    color: var(--orange-color);
    text-decoration: none;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  
  .see-all-link:hover {
    color: var(--primary-hover-color);
  }
  
  .see-all-link i {
    font-size: 14px;
  }
  
  /* Job Card Styles */
  .job-card {
    background: var(--white-color);
    border-radius: 12px;
    padding: 34px 24px;
    box-shadow: 0px 0px 50px -10px rgba(0, 0, 0, 0.06);
  }
  .job-card:hover {
    box-shadow: 0px 0px 40px 0px rgba(0, 0, 0, 0.08);
  }
  .rating {
    display: flex;
    align-items: center;
    gap: 8px;
  }
  
  .rating-score {
    color: var(--secondary-color);
    font-weight: 500;
  }
  
  .stars {
    color: #ffc107;
  }
  
  .company-name {
    color: var(--orange-color);
    font-weight: 500;
  }
  
  .job-title {
    font-size: 24px;
    font-weight: 600;
    color: var(--secondary-color);
    margin-bottom: 12px;
  }
  
  .job-description {
    color: var(--secondary-color);
    opacity: 0.8;
    margin-bottom: 24px;
    line-height: 1.6;
  }
  
  /* Applicants Section */
  .applicants {
    display: flex;
    align-items: center;
    gap: 16px;
  }
  
  .applicant-avatars {
    display: flex;
    align-items: center;
  }
  
  .avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 2px solid var(--white-color);
    margin-left: -8px;
  }
  
  .avatar:first-child {
    margin-left: 0;
  }
  
  /* Job Info Section */
  .job-info {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    border-top: 1px solid #e3e7e7;
    padding: 30px 0;
    border-bottom: 1px solid #e3e7e7;
  }
  
  .info-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
  }
  
  .info-item i {
    color: var(--orange-color);
    font-size: 18px;
    margin-top: 4px;
  }
  
  .info-label {
    display: block;
    font-size: 12px;
    text-transform: uppercase;
    color: var(--secondary-color);
    opacity: 0.9;
    letter-spacing: 2px;
    margin-bottom: 4px;
  }
  
  .info-value {
    display: block;
    color: var(--secondary-color);
    font-weight: 500;
  }
  
  /* Card Footer */
  .card-footer {
    padding: 0;
    margin-top: 24px;
    background: none;
    border: none;
  }
  
  .posted-date {
    color: var(--secondary-color);
    opacity: 0.7;
  }
  
  .apply-btn {
    background-color: var(--orange-color);
    border: none;
    color: #fff;
    padding: 8px 24px;
    border-radius: 40px;
  }
  
  .apply-btn:hover {
    background-color: var(--primary-hover-color);
  }
  
  /* Responsive Styles */
  @media (max-width: 991.98px) {
    .section-title {
      font-size: 36px;
    }
  
    .job-info {
      grid-template-columns: 1fr 1fr;
    }
  }
  
  @media (max-width: 767.98px) {
    .section-title {
      font-size: 32px;
    }
  
    .section-header {
      flex-direction: column;
      gap: 16px;
    }
  
    .job-info {
      grid-template-columns: 1fr;
    }
  
    .card-footer {
      flex-direction: column;
      gap: 16px;
      text-align: center;
    }
  
    .apply-btn {
      width: 100%;
    }
  }
  
  @media (max-width: 575.98px) {
    .section-title {
      font-size: 28px;
    }
  
    .job-card {
      padding: 16px;
    }
  
    .applicants {
      flex-direction: column;
      align-items: flex-start;
    }
  }
  
  /* Stats Section */
  .stats-section {
    background-color: #1a1a1a;
    padding: 60px 0;
    color: white;
  }
  .stat-item span {
    color: white;
  }
  .stat-item h2 {
    font-size: 48px;
    font-weight: 700;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    color: var(--orange-color);
    justify-content: center;
    gap: 4px;
  }
  
  .stat-item h2 .counter {
    display: inline-block;
  }
  
  .stat-item h2::after {
    color: var(--orange-color);
    font-weight: 500;
  }
  
  .stat-item p {
    font-size: 16px;
    opacity: 0.8;
    margin: 0;
  }
  
  /* Testimonial Section */
  .testimonial-section {
    padding: 100px 0;
    background-color: var(--background-color);
  }
  
  .testimonial-image {
    position: relative;
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
  }
  
  .testimonial-image .img {
    width: 100%;
    border-radius: 300px 300px 300px 300px;
    background-color: var(--orange-color);
  }
  
  .rating-box {
    position: absolute;
    left: -50px;
    bottom: 80px;
    background-color: #ff5c35;
    color: white;
    padding: 25px 35px;
    border-radius: 8px;
  }
  
  .rating-label {
    font-size: 14px;
    margin-bottom: 4px;
  }
  
  .rating-score-testimonial {
    font-size: 52px;
    font-weight: 700;
    line-height: 1;
    color: white;
  }
  
  .cursor-icon {
    position: absolute;
    left: 100%;
    top: 40%;
    transform: translate(-50%, -50%);
    width: 60px;
    height: 60px;
  }
  
  .cursor-icon img {
    width: 100%;
  }
  
  .testimonial-content h2 {
    font-size: 42px;
    font-weight: 600;
    color: var(--secondary-color);
    margin-bottom: 16px;
  }
  
  .testimonial-content .subtitle {
    font-size: 16px;
    color: var(--secondary-color);
    opacity: 0.8;
    margin-bottom: 40px;
  }
  
  /* Testimonial Slider */
  .job-testimonial-slider {
    position: relative;
    padding: 20px 0;
    border: 2px dashed #e3e7e7;
  }
  
  .testimonial-card {
    padding: 10px 70px;
  }
  
  .testimonial-text {
    font-size: 16px;
    line-height: 1.6;
    color: var(--secondary-color);
    margin-bottom: 24px;
  }
  
  .testimonial-author {
    display: flex;
    align-items: center;
    gap: 16px;
  }
  .testimonial-author img {
    object-fit: cover;
  }
  .author-image {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    object-fit: cover;
  }
  
  .author-info h5 {
    font-size: 18px;
    font-weight: 600;
    color: var(--secondary-color);
    margin: 0;
  }
  
  .author-info p {
    font-size: 14px;
    color: var(--secondary-color);
    opacity: 0.7;
    margin: 0;
  }
  
  .slider-navigation {
    display: flex;
    gap: 16px;
    margin-top: 24px;
    position: absolute;
  }
  
  .slider-prev {
    position: absolute;
    left: 30px;
    top: 50%;
    z-index: 1;
    color: var(--orange-color);
  }
  .slider-next {
    position: absolute;
    right: 30px;
    z-index: 1;
    top: 50%;
    color: var(--orange-color);
  }
  /* .slider-prev,
    .slider-next {
      width: 40px;
      height: 40px;
      border-radius: 50%;
      background-color: white;
      border: 1px solid #e0e0e0;
      color: var(--orange-color);
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      transition: all 0.3s ease;
    } */
  
  /* Responsive Styles */
  @media (max-width: 991.98px) {
    .testimonial-content h2 {
      font-size: 36px;
      margin-top: 40px;
    }
  
    .testimonial-image {
      max-width: 400px;
    }
  }
  
  @media (max-width: 767.98px) {
    .stat-item {
      margin-bottom: 30px;
    }
  
    .stat-item h2 {
      font-size: 36px;
    }
  
    .testimonial-content h2 {
      font-size: 28px;
    }
  }
  
  @media (max-width: 575.98px) {
    .testimonial-image {
      max-width: 300px;
    }
  
    .rating-box {
      padding: 10px 20px;
    }
  
    .rating-score {
      font-size: 28px;
    }
  }
  
  /* How We Work Section */
  .how-we-work-section {
    padding: 150px 0;
    background-color: var(--background-color);
    background: url("../public/images/how-we-work.jpg");
    background-position: center 10%;
    background-size: cover;
    background-repeat: no-repeat;
  }
  
  .work-content h2 {
    font-size: 42px;
    font-weight: 600;
    color: var(--secondary-color);
    margin-bottom: 16px;
  }
  
  .work-content .lead {
    color: var(--secondary-color);
    opacity: 0.8;
    font-weight: 400;
    margin-bottom: 40px;
    font-size: 16px;
  }
  
  .work-steps {
    position: relative;
  }
  
  .step-item {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 30px;
  }
  
  .step-icon-work {
    width: 50px;
    height: 50px;
    /* background-color: var(--orange-color); */
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }
  
  .step-icon-work img {
    width: 100%;
  }
  
  .step-content h4 {
    font-size: 18px;
    font-weight: 600;
    color: var(--secondary-color);
    margin-bottom: 8px;
  }
  
  .step-content p {
    font-size: 14px;
    color: var(--secondary-color);
    opacity: 0.8;
    margin: 0;
  }
  
  .step-arrow {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 20px 0;
    color: var(--secondary-color);
    opacity: 0.6;
  }
  
  .video-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .video-wrapper .play-btn {
    width: 60px;
    height: 60px;
    cursor: pointer;
    background: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .video-wrapper .play-btn i {
    font-size: 28px;
    margin-left: 5px;
    color: var(--orange-color);
  }
  
  /* Video Modal */
  .modal-content {
    background-color: transparent;
    border: none;
  }
  
  .btn-close {
    position: absolute;
    right: 15px;
    top: 15px;
    z-index: 1;
    background-color: white;
    opacity: 1;
    padding: 10px;
    border-radius: 50%;
  }
  
  /* Footer Styles */
  .job-footer {
    background-color: #1a1a1a;
    color: white;
    padding-top: 80px;
  }
  
  .footer-top {
    padding-bottom: 40px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  }
  
  .footer-top h2 {
    font-size: 38px;
    font-weight: 400;
    margin: 0;
  }
  
  .social-icons {
    display: flex;
    gap: 20px;
  }
  
  .social-icons a {
    color: white;
    font-size: 18px;
    opacity: 0.7;
    transition: 0.3s ease;
  }
  
  .social-icons a:hover {
    opacity: 1;
    color: var(--orange-color);
  }
  
  .footer-main {
    padding: 60px 0;
  }
  
  .footer-logo {
    height: 80px;
    margin-bottom: 30px;
  }
  
  .social-links {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  
  .social-links a {
    color: white;
    opacity: 0.7;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 10px;
    transition: 0.3s ease;
  }
  
  .social-links a:hover {
    opacity: 1;
    color: var(--orange-color);
  }
  
  .footer-widget h4 {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 25px;
  }
  
  .footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  
  .footer-links li {
    margin-bottom: 10px;
  }
  
  .footer-links a {
    color: white;
    opacity: 0.7;
    text-decoration: none;
    transition: opacity 0.3s ease;
    transition: 0.3s ease;
  }
  
  .footer-links a:hover {
    opacity: 1;
    color: var(--orange-color);
  }
  
  .work-hours {
    list-style: none;
    padding: 0;
    margin: 0 0 30px;
    opacity: 0.7;
  }
  
  .work-hours li {
    margin-bottom: 10px;
  }
  
  .help-section p {
    margin-bottom: 10px;
  }
  
  .contact-btn {
    display: inline-block;
    background-color: var(--orange-color);
    color: white;
    text-decoration: none;
    padding: 12px 24px;
    border-radius: 30px;
    transition: background-color 0.3s ease;
  }
  
  .contact-btn:hover {
    background-color: var(--primary-hover-color);
    color: white;
  }
  
  .footer-bottom {
    padding: 20px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
  }
  
  .footer-bottom p {
    margin: 0;
    opacity: 0.7;
  }
  
  .footer-bottom-links {
    display: flex;
    justify-content: flex-end;
    gap: 30px;
  }
  
  .footer-bottom-links a {
    color: white;
    opacity: 0.7;
    text-decoration: none;
    transition: 0.3s ease;
  }
  
  .footer-bottom-links a:hover {
    opacity: 1;
    color: var(--orange-color);
  }
  
  /* Responsive Styles */
  @media (max-width: 991.98px) {
    .how-we-work-section {
      padding: 60px 0;
    }
  
    .work-content {
      margin-bottom: 40px;
    }
  
    .footer-top h2 {
      font-size: 28px;
    }
  
    .footer-widget {
      margin-bottom: 40px;
    }
  }
  
  @media (max-width: 767.98px) {
    .work-content h2 {
      font-size: 32px;
    }
  
    .footer-top {
      text-align: center;
    }
  
    .footer-top .d-flex {
      flex-direction: column;
      gap: 20px;
    }
  
    .footer-bottom {
      text-align: center;
    }
  
    .footer-bottom-links {
      justify-content: center;
      margin-top: 15px;
    }
    .col-md-9{
      margin-top: 20px;
      padding: 0px !important;
    }
    .dashboard{
      margin-top: 150px !important;
    }
  }
  
  @media (max-width: 575.98px) {
    .work-content h2 {
      font-size: 28px;
    }
  
    .play-btn {
      width: 60px;
      height: 60px;
      font-size: 20px;
    }
  
    .footer-top h2 {
      font-size: 24px;
    }
  
    .footer-bottom-links {
      flex-direction: column;
      gap: 15px;
    }
    .dashboard{
      margin-top: 120px !important;
    }
  }
  
  .jobs-hero-section {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 10px;
    padding-top: 120px;
    height: 60vh;
    overflow: hidden;
  }
  
  .jobs-hero-bg-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
  }
  
  .jobs-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7); /* Same as your linear-gradient overlay */
    z-index: -1;
  }
  
   
  
  .jobs-hero-section h1{
      font-size: 44px;
      font-weight: bold;
      position: relative;
      z-index: 1;
  }
  .companies-hero-links a {
    text-decoration: none;
    color: white;
  }
  .companies-hero-links i {
    color: white;
    font-size: 12px;
  }
  
  .companies-hero-links a.active {
    color: var(--orange-color);
  }
  
  .companies-form .col-lg-3{
      background: white;
      border-radius: 10px;
      height: 500px;
  }
  .companies-form .col-lg-9 .bg-white{
      border-radius: 10px;
  }
  
  .companies-form label{
      font-size: 18px;
      font-weight: 600;
      margin-top: 0px !important;
  }
  
  .form-select2 {
      padding: 12px;
      border: 1px solid #e0e0e0;
      border-radius: 10px;
    }
  
    .form-select2:focus{
      outline: none !important;
      border-color: var(--orange-color);
    }
  
  
  
  
  .overview-logo{
    width: 230px;
    height: 150px;
    border-radius: 5px;
    border: 1px solid #b3b3b3;
    justify-content: center;
    display: flex;
    align-items: center;
    background-color: #fff;
    margin-top: -70px;
  }
  
  .overview-tabs .nav-link.active {
    color: var(--orange-color);
    background-color: #f5f5f5;
    font-weight: 400;
    border-bottom: 4px solid var(--orange-color) !important;
  }
  .overview-tabs .nav-link {
    color: #4a4a4a;
    border-radius: 0px !important;
    border-right:1px solid var(--navbar-scroll-color) !important;
  }
  .overview-tabs .nav-tabs .nav-link {
    border: 1px solid #f9f9f93a;
  }
  .overview-tabs .content-header {
    background-color:#fee2c8;
    color: #4a4a4a;
    border-radius:8px 8px 0px 0px;
    padding: 20px;
  }
  
  .overview-tabs .company-info-card {
    background-color: #f9f9f93a;
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 15px;
    margin-bottom: 15px;
  }
  
  .overview-tabs .site-link p {
    font-size: 14px;
    margin: 0;
    color: var(--primary-color);
  }
  
  .overview-tabs .site-link a {
    text-decoration: none;
    color: var(--primary-color);
  }
  
  /* .matrimony-sidebar{
    max-height: 380px;
  } */
  .dashboard-avatar{
    width: 70px;
    border: 3px solid var(--orange-color);
    border-radius: 50%;
  }
  .UserDashboard-name{
    font-size: 1.5rem;
  }
  .dashboard .nav-link{
    margin: 10px 5px;
      background-color: #ffffff !important; /* White background for tabs */
      border: none; /* Light border */
      border-radius: 5px; /* Rounded corners */
      color: #333; /* Dark text color */
      font-weight:500;
      padding: 10px 15px; /* Add padding */
      transition: all 0.3s ease-in-out; /* Smooth hover effect */
  }
  
  .dashboard .nav-link.active {
      background-color: #ffffff !important; /* Active tab background */
      color: #333; /* Active tab text color */
      border-color: none; /* Active tab border */
  }
  
  .dashboard .nav-link:hover {
      background-color: #f1f1f1 !important; /* Hover effect */
      color: #333 !important; /* Text color on hover */
  }
  .dashboard .logout{
    color: rgb(255, 25, 12);
  }
  .dashboard .logout:hover{
    color: rgb(255, 25, 12) !important;
    background-color:rgb(255, 241, 240) !important;
  }
  
  .dashboardHeader{
    background-color: #dddddd6b;
    border-radius:5px 5px 0px 0px !important;
    color: #444 !important;
  }
  .dashboard .tab-content{
    background-color: #ffffff;
  }
  .dashboard .form-control::placeholder{
    color: #999999a9;
  }
  .dashboard .form-control:hover{
    box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.1) !important;
    cursor: pointer;
  }
  .dashboard .form-control:focus{
    box-shadow: none;
    border: 1px solid #ddd !important;
  }
  .dashboard .upload-label{
    cursor: pointer;
    background-color: #ffb5704f;
    color: #444;
    padding: 20px 100px;
    border-radius: 10px;
  }
  .dashboard .upload-label:hover{
    background-color: #ffb57067;
  }
  .dashboard input[type="file"] {
    padding: 10px; /* Add padding inside the file input field */
    border: 1px solid #ddd; /* Light border for consistency */
    border-radius: 5px; /* Rounded corners */
  }
  
  .dashboard .card {
    background-color: #fff;
    border: none;
  }
  
  .dashboard .text-orange {
    color: #FF7F00;
  }
  
  .dashboard .fa-external-link {
    font-size: 12px;
  }
  
  .dashboard .card:hover {
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2) !important;
  }
  .dashboard .form-select {
    display: block;
    width: 100%;
    padding: .375rem 2.25rem .375rem .75rem;
    -moz-padding-start: calc(0.75rem - 3px);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-position: right .75rem center;
    background-size: 16px 12px;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
  }
  
  :root {
    --success-color: #FF7F00;
    --gray-color: #ddd;
  }
  
  .progress-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 40px 0;
    position: relative;
  }
  
  .progress-container::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    height: 4px;
    width: 100%;
    background-color: var(--gray-color);
    z-index: 0;
  }
  
  .progress-bar {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    height: 4px;
    width: 0%;
    background-color: var(--success-color);
    z-index: 1;
    transition: width 0.3s ease;
  }
  
  .progress-step {
    width: 30px;
    height: 30px;
    background-color: #fff;
    border: 2px solid var(--gray-color);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    color: var(--gray-color);
    z-index: 2;
    transition: all 0.3s ease;
  }
  
  .progress-step.active {
    border-color: var(--primary-color);
    color: var(--primary-color);
  }
  
  .progress-step.completed {
    background-color: var(--success-color);
    border-color: var(--success-color);
    color: #fff;
  }
  
  .form-step {
    display: none;
  }
  
  .form-step.active {
    display: block;
  }
  .btn-secondary{
    background-color: var(--gray-color);
    color: #66666666; 
    border: 1px solid #99999999;
    border-radius: 20px;
    font-weight: bold;
  }
  
  
  
  .custom-filter-modal .modal-content {
    border-radius: 10px;
  }
  .custom-filter-modal ul{
    padding-left:0px !important;
    list-style-type: none !important;
  }
  .custom-filter-modal .list-group-item.active {
    background-color: var(--primary-hover-color);
    color: #fff;
    font-weight: bold;
    border: none !important;
  }
  .custom-filter-modal .list-group-item {
    display: flex;
    justify-content: space-between;  /* This will push content to left and icon to the right */
    align-items: center;
  }
  .custom-filter-modal .list-group-item {
    cursor: pointer;
  }
  /* Modal-specific styling */
  .custom-filter-modal .modal-content {
    border-radius: 10px;
  }
  
  /* Custom Radio Buttons inside the modal */
  .custom-filter-modal .custom-radio input[type="radio"] {
    appearance: none; /* Remove default radio button appearance */
    -webkit-appearance: none; /* Safari/Chrome */
    -moz-appearance: none;    /* Firefox */
    width: 13px;
    height: 13px;
    border-radius: 3px;
    border: 1px solid var(--primary-color); /* Default border color */
    position: relative;
    cursor: pointer;
    transition: all 0.3s ease;
    margin-right: 8px;
  }
  
  /* Radio button checked state - change background */
  .custom-filter-modal .custom-radio input[type="radio"]:checked {
    background-color: var(--primary-color); /* Primary background color when checked */
    border-color: var(--primary-color);     /* Same color for border */
  }
  
  /* Add tick when checked */
  .custom-filter-modal .custom-radio input[type="radio"]:checked::after {
    content: '\2713'; /* Unicode checkmark */
    position: absolute;
    top: -1px;
    left: 2px;
    font-size: 9px;
    font-weight: 600;
    color: white; /* Color of the checkmark */
  }
  
  /* Unchecked state - inner circle */
  .custom-filter-modal .custom-radio input[type="radio"]::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    background-color: transparent;
    border-radius: 50%;
  }
  
  /* Hover effect */
  .custom-filter-modal .custom-radio input[type="radio"]:hover {
    border-color: var(--primary-color); /* Darker border on hover */
  }
  
  /* Focus effect */
  .custom-filter-modal .custom-radio input[type="radio"]:focus {
    outline: none;
    border-color: var(--primary-color); /* Focus border color */
  }
  
  /* Custom Checkboxes inside the modal */
  .custom-filter-modal .custom-checkbox input[type="checkbox"] {
    appearance: none; /* Remove default checkbox appearance */
    -webkit-appearance: none; /* Safari/Chrome */
    -moz-appearance: none;    /* Firefox */
    width: 13px;
    height: 13px;
    border-radius: 3px; /* Rounded corners for checkboxes */
    border: 1px solid var(--primary-color); /* Default border color */
    position: relative;
    cursor: pointer;
    transition: all 0.3s ease;
  }
  
  /* Checkbox checked state - change background */
  .custom-filter-modal .custom-checkbox input[type="checkbox"]:checked {
    background-color: var(--primary-color); /* Primary background color when checked */
    border-color: var(--primary-color);     /* Same color for border */
  }
  
  /* Add tick when checked for checkbox */
  .custom-filter-modal .custom-checkbox input[type="checkbox"]:checked::after {
    content: '\2713'; /* Unicode checkmark */
    position: absolute;
    top: -1px;
    left: 2px;
    font-size: 9px;
    font-weight: 600;
    color: white; /* Color of the checkmark */
  }
  
  /* Hover effect */
  .custom-filter-modal .custom-checkbox input[type="checkbox"]:hover {
    border-color: var(--primary-color); /* Darker border on hover */
  }
  
  /* Focus effect */
  .custom-filter-modal .custom-checkbox input[type="checkbox"]:focus {
    outline: none;
    border-color: var(--primary-color); /* Focus border color */
  }
  
  
  
  
  /* new css  */
  
  
  .nav-link-active{
    color: var(--primary-color) !important;
  }
  
  .jobs-contact-info {
    background-color: #fbfbfb;
    padding: 100px 0px;
  }
  
  .jobs-contact-card {
    padding: 30px;
    border-radius: 20px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.05);
    text-align: center;
    transition: 0.3s;
    height: 250px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border: 1px solid #b9bfc5;
  }
  
  .jobs-contact-call{
    background: #f9fef3;
  }
  .jobs-contact-call .jobs-contact-icon{
    background: #ebffd2;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto; 
    margin-bottom: 20px;
  }
  .jobs-contact-email{
    background: #f1f9fc;
  }
  .jobs-contact-email .jobs-contact-icon{
    background: #c9ebf4;
    width: 50px !important;
    height: 50px !important;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto; 
    margin-bottom: 20px;
  }
  .jobs-contact-visit{
    background: #fff5f3;
  }
  .jobs-contact-visit .jobs-contact-icon{
    background: #ffdad9;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto; 
    margin-bottom: 20px;
  }
  .jobs-contact-call i{
    color: #c1e594;
  }
  .jobs-contact-email i{
    color: #45a5bc;
  }
  .jobs-contact-visit i{
    color: #eca694;
  }
  .jobs-contact-card:hover {
    transform: translateY(-5px);
  }
  
  .jobs-contact-icon {
    font-size: 24px;
    color: var(--contact-primary);
    margin-bottom: 10px;
  }
  
  .jobs-contact-card h4 {
    font-size: 28px;
    font-weight: bold;
    color: var(--contact-text);
    margin-bottom: 5px;
  }
  
  .jobs-contact-card p,
  .jobs-contact-card address {
    font-size: 16px;
    color: #777;
    margin-bottom: 10px;
  }
  
  .jobs-contact-link {
    font-size: 16px;
    color: var(--contact-primary);
    text-decoration: none;
    font-weight: bold;
  }
  
  .jobs-contact-link:hover {
    text-decoration: none;

  }
  
  /* Contact Form */
  .jobs-contact-form {
    background-color: #fbfbfb;
    padding: 50px 0px 100px 0px;
  }
  
  .jobs-contact-title {
    font-size: 48px;
    font-weight: 500;
    color: var(--contact-text);
  }
  
  .jobs-contact-subtext {
    font-size: 16px;
    color: #777;
    margin-bottom: 20px;
  }
  
  .jobs-contact-form .form-control {
    border-radius: 5px;
    padding: 10px;
    border: 1px solid #ddd;
  }
  
  .jobs-contact-form .btn-dark {
    padding: 10px 20px;
    border-radius: 5px;
    font-weight: 400;
  }
  
  /* Google Map */
  .jobs-contact-map iframe {
    border-radius: 10px;
    width: 100%;
    height: 500px;
  }
  
  /* Responsive Design */
  @media (max-width: 768px) {
    .jobs-contact-info .row {
      text-align: center;
    }
  
    .jobs-contact-card {
      padding: 20px;
    }
  
    /* .jobs-contact-form {
      text-align: center;
    } */
  
    .jobs-contact-form form {
      max-width: 100%;
    }
  .jobs-contact-map iframe {
    margin-top: 50px;
  }
  }
  
  
  
  
  
  
  
   
  /* Main Section Styling */
  .jobs-step-section{
    background: #fbfbfb ;
  }
  .jobs-step-section .container{
    background-color: #e1e3e5;
    margin-bottom: 50px;
    border-radius: 30px;
  } 
  
  .jobs-step-box {
    border-radius: 15px;
  }
  
  /* Left Text Content */
  .jobs-step-title {
    font-size: 48px;
    font-weight: 500;
    color: var(--step-text);
  }
  
  .jobs-step-description {
    font-size: 16px;
    color: #555;
    margin-bottom: 15px;
  }
  
  .jobs-step-list {
    list-style: none;
    padding: 0;
    margin-bottom: 20px;
  }
  
  .jobs-step-list li {
    font-size: 16px;
    color: #444;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
  }
  
  .jobs-step-list li i {
    color: black;
    margin-right: 10px;
    font-size: 18px;
  }
  
  /* Button Styling */
  .jobs-step-button {
    padding: 10px 20px;
    border-radius: 5px;
    font-weight: 500;
  }
  
  /* Right Image Content */
  .jobs-step-image {
    position: relative;
    display: inline-block;
  }
  
  .jobs-step-image img {
    max-width: 100%;
    border-radius: 15px;
  }
  
  .jobs-step-caption {
    position: absolute;
    bottom: 20px;
    left: -50px;
    background-color: transparent;
    padding: 5px 10px;
    text-align: left;
  }
  
  .jobs-step-caption h5 {
    font-size: 20px;
    font-weight: 500;
    color: #444;
    margin-bottom: 20px; 
    margin-right: 50px;
  }
  .jobs-step-caption h5::after{
    content: '';
    background: #000;
    height: 1px;
    width: 100%;
    display: block;
  }
  
  
  .jobs-step-caption p {
    font-size: 16px;
    color: #888;
    margin-top: -15px;
  }
  
  /* Responsive Adjustments */
  @media (max-width: 768px) {
    
  
    .jobs-step-list li {
      justify-content: center;
    }
  
    .jobs-step-caption {
      text-align: center;
      left: 50%;
      transform: translateX(-50%);
    }
  }
  
  .job-blogs {
    padding: 80px 0;
  }
  
  .job-blogs-label {
    color: var(--primary-color);
    font-size: 18px;
    display: block;
    margin-bottom: 16px;
  }
  
  .job-blogs-header h2 {
    font-size: 48px;
    font-weight: 500;
    margin-bottom: 16px;
  }
  
  .job-blogs-description {
    color: #666;
    max-width: 600px;
    margin: 0 auto;
  }
  
  /* Row height matching */
  .job-blogs .row {
    height: 100%;
  }
  
  .job-blogs .col-lg-6 {
    display: flex;
    flex-direction: column;
  }
  
  /* Card container styles */
  .job-blogs-featured,
  .job-blogs-card {
    border-radius: 16px;
    overflow: hidden;
    background: #fff;
    height: 100%;
    display: flex;
    flex-direction: column;
  }
  
  /* Image container */
  .job-blogs-image-container {
    flex: 1;
    position: relative;
    min-height: 300px;
  }
  
  .job-blogs-featured img,
  .job-blogs-card img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 16px;
  }
  
  /* Content styles */
  .job-blogs-content {
    padding: 24px 0;
  }
  
  .job-blogs-date {
    color: #666;
    font-size: 14px;
    display: block;
    margin-bottom: 12px;
  }
  
  .job-blogs-content h3 {
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 12px;
  }
  
  .job-blogs-content p {
    color: #666;
    margin: 0;
    line-height: 1.6;
  }
  
  .job-blogs-btn {
    display: inline-block;
    padding: 12px 24px;
    background: #000;
    color: #fff;
    text-decoration: none;
    border-radius: 4px;
    transition: background-color 0.3s;
  }
  
  .job-blogs-btn:hover {
    background: #333;
    color: #fff;
  }
  
  /* Make right column cards equal height */
  .job-blogs .col-lg-6 .row {
    height: 100%;
  }
  
  .job-blogs .col-lg-6 .col-12 {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  /* Responsive Styles */
  @media (max-width: 991.98px) {
    .job-blogs-content h3 {
      font-size: 20px;
    }
  }
  
  @media (max-width: 767.98px) {
    .job-blogs {
      padding: 60px 0;
    }
    
    .job-blogs-header h2 {
      font-size: 28px;
    }
  }
  
  @media (max-width: 575.98px) {
    .job-blogs-content {
      padding: 20px 0;
    }
    
    .job-blogs-content h3 {
      font-size: 18px;
    }
    
    .job-blogs-content p {
      font-size: 14px;
    }
  }
  
  
  
  
  
  
  /* about us */
  
  .about-us-section {
    padding: 60px 0px;
    background: #fbfbfb;
  }
  
  /* Heading */
  .about-us-heading {
    color: black;
    font-weight: 700;
    font-size: 2rem;
  }
  
  /* Paragraphs */
  .about-us-text {
    color: var(--secondary-color);
    font-size: 1.1rem;
    line-height: 1.7;
    text-align: justify;
  }
  
  /* Image Styling */
  .about-us-img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    border: 2px solid #dbe4ed;
  }
  
  /* Responsive Text */
  @media (max-width: 768px) {
    .about-us-heading {
        font-size: 1.8rem;
        text-align: center;
    }
  
    .about-us-text {
        font-size: 1rem;
        text-align: center;
    }
  }
  
  /* Mobile Responsive */
  @media (max-width: 576px) {
    .about-us-section {
        padding: 40px 10px;
    }
  
    .about-us-heading {
        font-size: 1.5rem;
    }
  
    .about-us-text {
        font-size: 0.95rem;
    }
  }
  
  
  /* about why-choose-us */
  .about-why-choose-section {
    background-color: #fef4ea; /* Keeping the original background */
    padding: 100px 0px;
  }
  
  /* Box Styling */
  .about-why-choose-box {
    background-color: var(--white-color);
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0px 4px 10px var(--navbar-shadow-color);
    transition: transform 0.3s ease-in-out;
    display: flex;
    flex-direction: column;
    /* justify-content: space-between; */
    height: 100%; /* Ensures all boxes have the same height */
  }
  
  .about-why-choose-box:hover {
    transform: translateY(-5px);
  }
  
  /* Header Styling: Image and Title in One Line */
  .about-why-choose-header {
    display: flex;
    align-items: center;
    gap: 15px;
    /* justify-content: flex-start; */
    margin-bottom: 20px;
  }
  
  /* Icon Styling */
  .about-why-choose-icon {
    width: 30px;
    height: 30px;
  }
  
  /* Title */
  .about-why-choose-title {
    color: var(--secondary-color);
    font-weight: bold;
    font-size: 1.2rem;
    margin: 0;
  }
  
  /* Description Text */
  .about-why-choose-text {
    color: var(--secondary-color);
    font-size: 1rem;
    line-height: 1.5;
  }
  
  /* Responsive Layout */
  @media (max-width: 992px) {
    .about-why-choose-box {
        padding: 18px;
    }
    .about-why-choose-title {
        font-size: 1.1rem;
    }
    .about-why-choose-text {
        font-size: 0.95rem;
    }
  }
  
  @media (max-width: 768px) {
    .about-why-choose-section {
        padding: 40px 10px;
    }
    .about-why-choose-title {
        font-size: 1rem;
    }
    .about-why-choose-text {
        font-size: 0.9rem;
    }
  }
  
  @media (max-width: 576px) {
    .about-why-choose-title {
        font-size: 0.95rem;
    }
    .about-why-choose-text {
        font-size: 0.85rem;
    }
  }














  
.job-blogs {
  padding: 80px 0;
  margin-bottom: 100px;
}
 
.job-blogs-label {
  color: var(--primary-color);
  font-size: 18px;
  display: block;
  margin-bottom: 16px;
}
 
.job-blogs-header h2 {
  font-size: 48px;
  font-weight: 500;
  margin-bottom: 16px;
}
 
.job-blogs-description {
  color: #666;
  max-width: 600px;
  margin: 0 auto;
}
 
/* Row height matching */
.job-blogs .row {
  height: 100%;
}
 
.job-blogs .col-lg-6 {
  display: flex;
  flex-direction: column;
}
 
/* Card container styles */
.job-blogs-featured,
.job-blogs-card {
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  height: 100%;
  display: flex;
  flex-direction: column;
}
 
/* Image container */
.job-blogs-image-container {
  flex: 1;
  position: relative;
  min-height: 300px;
}
 
.job-blogs-featured img,
.job-blogs-card img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 16px;
}
 
/* Content styles */
.job-blogs-content {
  padding: 24px 0;
}
 
.job-blogs-date {
  color: #666;
  font-size: 14px;
  display: block;
  margin-bottom: 12px;
}
 
.job-blogs-content h3 {
  font-size: 24px;
  font-weight: 500;
  margin-bottom: 12px;
}
 
.job-blogs-content p {
  color: #666;
  margin: 0;
  line-height: 1.6;
}
 
.job-blogs-btn {
  display: inline-block;
  padding: 12px 24px;
  background: #000;
  color: #fff;
  text-decoration: none;
  border-radius: 4px;
  transition: background-color 0.3s;
}
 
.job-blogs-btn:hover {
  background: #333;
  color: #fff;
}
 
/* Make right column cards equal height */
.job-blogs .col-lg-6 .row {
  height: 100%;
}
 
.job-blogs .col-lg-6 .col-12 {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
 
/* Responsive Styles */
@media (max-width: 991.98px) {
  .job-blogs-content h3 {
    font-size: 20px;
  }
}
 
@media (max-width: 767.98px) {
  .job-blogs {
    padding: 60px 0;
  }
 
  .job-blogs-header h2 {
    font-size: 28px;
  }
}
 
@media (max-width: 575.98px) {
  .job-blogs-content {
    padding: 20px 0;
  }
 
  .job-blogs-content h3 {
    font-size: 18px;
  }
 
  .job-blogs-content p {
    font-size: 14px;
  }
}