/*googgle maps*/
.autocomplete-container {
  position: relative;
}

.suggestion-item {
  padding: 10px;
  cursor: pointer;
}

    /* Autocomplete Box Container */
#suggestions {
  position: absolute;
  background: #fff;
  /*border: 1px solid #dcdcdc;*/
  border-radius: 4px;
  margin-top: 2px;
  width: 100%;
  max-height: 280px;
  overflow-y: auto;
  box-shadow: 0 4px 10px rgba(0,0,0,0.15);
  z-index: 2000;
}

/* Each Suggestion Item */
.gm-suggestion-item {
  padding: 10px 12px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  border-bottom: 1px solid #eee;
  transition: background 0.15s ease;
}

/* Remove last border */
.gm-suggestion-item:last-child {
  border-bottom: none;
}

/* Hover effect like Google */
.gm-suggestion-item:hover {
  background: #f5f5f5;
}

/* Keyboard selected item */
.gm-suggestion-item.gm-selected {
  background: #e8f0fe; /* Google's light blue highlight */
}

/* Main text (title) */
.gm-main {
  font-size: 14px;
  color: #202124;
  font-weight: 500;
}

/* Secondary text (address) */
.gm-secondary {
  font-size: 12px;
  color: #5f6368;
  margin-top: 2px;
}

/* Highlighted substring (matched letters) */
.gm-match {
  font-weight: 700;
  color: #000;
}
/*======================*/

:root {
            --brand-primary: #0066FF; /* ITM Recruitment services Blue */
            --brand-dark: #004EB3;
            --text-dark: #333333;
            --text-light: #666666;
            --bg-light: #F4F7FA;
        }

        body {
            font-family: 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
            color: var(--text-dark);
            overflow-x: hidden;
        }

        /* Navbar Styles */
        .navbar {
            background-color: #fff;
            padding: 1px 0;
            box-shadow: 0 2px 10px rgba(0,0,0,0.05);
        }

        .navbar-brand {
            font-weight: 800;
            font-size: 1.5rem;
            color: var(--brand-primary) !important;
        }

        .nav-link {
            color: var(--text-dark) !important;
            font-weight: 500;
            margin: 0 10px;
        }

        .nav-link:hover {
            color: var(--brand-primary) !important;
        }

        .btn-header-login {
            border: 1px solid var(--brand-primary);
            color: var(--brand-primary);
            background: transparent;
            margin-right: 10px;
            padding: 8px 20px;
            border-radius: 5px;
        }

        .btn-header-register {
            background-color: var(--brand-primary);
            color: white;
            padding: 8px 20px;
            border-radius: 5px;
        }

        .btn-header-register:hover {
            background-color: var(--brand-dark);
            color: white;
        }

        /* Hero Section */
        .hero-section {
            background: linear-gradient(135deg, #e6f0ff 0%, #ffffff 100%);
            padding: 80px 0 60px 0;
            position: relative;
        }

        .hero-title {
            font-weight: 800;
            color: #222;
            margin-bottom: 20px;
            margin-top: 35px;
        }

        .hero-subtitle {
            color: var(--text-light);
            font-size: 1.1rem;
            margin-bottom: 30px;
        }

        .search-card {
            background: white;
            padding: 20px;
            border-radius: 12px;
            box-shadow: 0 10px 30px rgba(0,0,0,0.08);
            max-width: 900px;
            margin: 0 auto;
        }

        .form-control-search {
            border: 1px solid #ddd;
            border-radius: 8px;
            padding: 12px 15px 12px 45px;
            height: 50px;
        }

        .search-icon-wrapper {
            position: absolute;
            left: 15px;
            top: 50%;
            transform: translateY(-50%);
            color: #999;
        }

        .btn-search {
            background-color: var(--brand-primary);
            color: white;
            height: 50px;
            border-radius: 8px;
            padding: 0 30px;
            font-weight: 600;
            border: none;
        }

        .btn-search:hover {
            background-color: var(--brand-dark);
            color: white;
        }

        .employer-cta {
            margin-top: 20px;
            font-size: 0.9rem;
        }

        /* Stats Section */
        .stats-section {
            padding: 40px 0;
            background-color: white;
            border-bottom: 1px solid #eee;
        }
        
        .stat-item h3 {
            font-weight: 700;
            color: var(--brand-primary);
        }

        /* Categories Section */
        .section-title {
            font-weight: 700;
            margin-bottom: 40px;
            position: relative;
            display: inline-block;
        }

        .category-card {
            border: 1px solid #fff723;
            border-radius: 10px;
            padding: 20px;
            text-align: center;
            transition: all 0.3s ease;
            cursor: pointer;
            height: 100%;
            background: #fffcb0;
        }

        .category-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 20px rgba(0,0,0,0.1);
            border-color: var(--brand-primary);
        }

        .category-icon {
            font-size: 2.5rem;
            color: #fbbc0a;
            margin-bottom: 15px;
        }

        .category-name {
            font-weight: 600;
            color: #333;
        }

        .category-vacancy {
            font-size: 0.85rem;
            color: #777;
            margin-top: 5px;
        }

        /* Why Choose Us */
        .why-us-section {
            background-color: var(--bg-light);
            padding: 80px 0;
        }

        .feature-box {
            text-align: left;
            padding: 30px;
            background: white;
            border-radius: 12px;
            height: 100%;
            border: 1px solid transparent;
            transition: 0.3s;
        }

        .feature-box:hover {
            border-color: var(--brand-primary);
        }

        .feature-icon-box {
            width: 60px;
            height: 60px;
            background-color: rgba(0, 102, 255, 0.1);
            color: var(--brand-primary);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.5rem;
            margin-bottom: 20px;
        }

        /* App Download Section */
        .app-section {
            padding: 80px 0;
        }

        .app-btn-img {
            height: 45px;
            margin-right: 10px;
            margin-bottom: 10px;
        }

