/* Extra responsive / mobile-friendly tweaks layered on top of the template's own CSS. */

/* Make the Google Map on the contact page responsive instead of a fixed 400px width. */
.map-responsive {
    position: relative;
    overflow: hidden;
    padding-top: 75%;
    height: 0;
}

.map-responsive iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* Keep uploaded images a consistent height in card/grid layouts. */
.course-item img,
.gallery-item img,
.category-item img {
    width: 100%;
    height: 220px;
    object-fit: cover;
}

.team-item img {
    width: 100%;
    height: 260px;
    object-fit: cover;
}

/* Comfortable tap targets on small screens. */
@media (max-width: 991.98px) {

    .navbar-nav .nav-link,
    .dropdown-item {
        padding-top: .6rem;
        padding-bottom: .6rem;
    }

    .navbar-nav>.btn,
    .navbar-collapse>.btn {
        display: block !important;
        margin: 1rem 1.5rem;
        width: calc(100% - 3rem);
        text-align: center;
    }

    .navbar-collapse .dropdown-item.disabled {
        padding-left: 1.5rem;
        font-style: italic;
    }
}

/* New/Updated badge used on News cards and elsewhere. */
.badge-status-new {
    background: #e8fbfc;
    color: var(--primary);
    border: 1px solid var(--primary);
}

/* Stat / impact counter tiles. */
.stat-tile {
    text-align: center;
    padding: 1.75rem 1rem;
}

.stat-tile .stat-value {
    font-size: 2.4rem;
    font-weight: 800;
    color: var(--primary);
    line-height: 1.1;
}

.stat-tile .stat-label {
    color: #6c757d;
    font-size: .95rem;
    margin-top: .35rem;
}

/* Affiliation / recognition logo strip. */
.affiliation-logo {
    height: 70px;
    max-width: 100%;
    object-fit: contain;
    filter: grayscale(30%);
}

/* Program (ITI / Skill Development / Trust Activities) intro cards on the homepage. */
.program-card {
    border-radius: .6rem;
    overflow: hidden;
    height: 100%;
    box-shadow: 0 1px 8px rgba(0, 0, 0, .06);
}

.news-card img,
.centre-card img {
    width: 100%;
    height: 190px;
    object-fit: cover;
}

.status-badge-new { background:#0d6efd; }
.status-badge-reviewed { background:#6c757d; }
.status-badge-contacted { background:#fd7e14; }
.status-badge-enrolled { background:#198754; }
.status-badge-rejected { background:#dc3545; }
.status-badge-approved { background:#198754; }

/* Prevent long words/emails from breaking mobile layout. */
.footer p,
.footer a {
    overflow-wrap: anywhere;
}

/* Simple alert used for form feedback. */
.form-alert {
    border-radius: .5rem;
}