img.header-logo {
    height: 50px;
}

.list-group-item-action {
    cursor: pointer;
}

.simple-button {
    background: linear-gradient(45deg, #673ab7, #dc3545);
    border: 0;
    padding: 10px 25px;
    font-size: 15px;
    font-weight: 700;
    color: white;
}

.breadcrumb-item + .breadcrumb-item::before {
    float: left;
    padding-right: var(--bs-breadcrumb-item-padding-x, 0.5rem);
    color: var(--bs-breadcrumb-divider-color, #6c757d);
    content: var(--bs-breadcrumb-divider, "/"); /* Or use ">" */
}

.text-primary {
    color: #094a99 !important;
}

.btn-warning {
    background: linear-gradient(269deg, #ff9800, #ffc107, #ff9800) !important;
}

.btn-danger {
    background: linear-gradient(269deg, #c1081a, #f44336, #9d1006);
    color: #fff;
    border: none;
}

.btn-second,
.btn-second:hover {
    background: linear-gradient(269deg, #673ab7, #dc3545);
    color: #fff;
    border: none;
}

.btn-primary {
    background: linear-gradient(269deg, #002366, #4169e1, #002366);
    color: #fff;
    border: none;
}
.btn-primary:hover {
    background: linear-gradient(269deg, #1a3db4, #5a7be5, #1a3db4);
    color: #fff;
}

.btn-secondary,
.btn-secondary:hover {
    background: white;
    color: black !important;
    border: 0px;
    box-shadow: 0px 0px 3px 1px black;
}

.btn-info,
.btn-info:hover {
    background: #17313b;
    color: white !important;
    border: 0px;
    box-shadow: 0px 0px 3px 1px #17313b;
}

.btn-pro {
    background: linear-gradient(269deg, #002366, #4169e1, #002366);
    color: #fff;
    border: none;
}

.btn-pro:hover {
    background: linear-gradient(269deg, #1a3db4, #5a7be5, #1a3db4);
    color: #fff;
}

.btn-success {
    background: linear-gradient(358deg, #004004, #0ed416);
    border: 0;
}

/* Section title */
.section-title {
    font-size: 2rem;
    color: #333;
}

/* Card layout for services */
.service-card {
    background-color: #fff;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 1px 1px 3px 3px rgb(75 121 144);
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    height: 100%;
    color: #333;
}

.service-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.12);
    color: #000;
}

.service-title {
    font-size: 1rem;
    font-weight: 600;
}

/* Responsive tweaks */
@media (max-width: 576px) {
    .service-title {
        font-size: 0.95rem;
    }
}

/* Section styling */
.city-selector-section {
    background: #f8f9fa;
}

.section-title {
    font-size: 2rem;
    font-weight: 700;
    color: #333;
}

/* Grid layout */
.city-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 25px;
    list-style: none;
    padding: 0;
    margin: 0 auto;
    max-width: 1000px;
}

/* City cards */
.city-card {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 0 4px 2px #000c11;
    width: 140px;
    text-align: center;
    padding: 15px 10px;
    transition: transform 0.2s ease, box-shadow 0.3s ease;
    cursor: pointer;
}

.city-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12);
}

/* City image */
.city-image {
    width: 60px;
    height: 60px;
    object-fit: contain;
    margin-bottom: 10px;
}

/* City name */
.city-name {
    font-size: 16px;
    font-weight: 600;
    color: #333;
}

/* Responsive tweaks */
@media (max-width: 576px) {
    .city-card {
        width: 42%;
    }

    .city-name {
        font-size: 14px;
    }

    .city-image {
        width: 50px;
        height: 50px;
    }
}

.hero-section {
    background: linear-gradient(45deg, #673ab7, #dc3545);
    color: white;
    padding: 100px 0;
    text-align: center;
}
.section {
    padding: 60px 0;
}
.section-title {
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 30px;
    text-align: center;
}
.card-tour img {
    height: 180px;
    object-fit: cover;
}

.toggle-btn-group .btn {
    width: 140px;
    font-weight: 500;
}
.role-user {
    background-color: #e7f1ff; /* soft blue */
}
.role-driver {
    background-color: #fffbe6; /* soft yellow */
}



 .section-1 { background: linear-gradient(2deg, #f8bbd0, #ffe082); }
.section-2 { background: linear-gradient(2deg, #b3e5fc, #e0f7fa); }
.section-3 { background: linear-gradient(2deg, #c8e6c9, #dcedc8); }
.section-4 { background: linear-gradient(2deg, #e1bee7, #bbdefb); }
.section-5 { background: linear-gradient(2deg, #ffe0b2, #fff9c4); }
.section-6 { background: linear-gradient(2deg, #f5f5f5, #d0f0fd); }
.section-7 { background: linear-gradient(2deg, #d0f0fd, #e0ffff); }
.section-8 { background: linear-gradient(2deg, #fcdada, #fff0f5); }
.section-9 { background: linear-gradient(2deg, #d9fdd3, #f0fff0); }
.section-10 { background: linear-gradient(2deg, #fff9e6, #fdf5e6); }
.section-11 { background: linear-gradient(2deg, #e6ccff, #f3e5f5); }
.section-12 { background: linear-gradient(2deg, #ffd1cc, #fff2e6); }
.section-13 { background: linear-gradient(2deg, #f9f9f9, #e1f5fe); }
.section-14 { background: linear-gradient(2deg, #fff0f5, #ffe5b4); }
.section-15 { background: linear-gradient(2deg, #f5fff9, #d0f5e3); }
.section-16 { background: linear-gradient(2deg, #fcdada, #d0f0fd); }