a {
    text-decoration: none;
    text-align: center;
    font-weight: bold;
}

.doctors-item,
.opd-wrapper {
    background-color: white;
    padding: 20px 25px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    border-radius: 20px;
}

.doctors-item-img-wrapper {
    display: flex;
    justify-content: center;
}

.doctors-item-img {
    width: 100%;
    height: auto;
    border-radius: 16px;
    object-fit:contain;
}
@media (max-width:767px){
    .doctors-item-img {
        width: 100%;
        height: 100%;
    }
}
.small-icon {
    width: 20px;
    height: 20px;
    margin-right: 5px;
}

.doctor-name {
    color: var(--theme-dark-green);
    font-weight: bold;
}

.resident-status {
    width: fit-content;
    background-color: #bfe6e3;
    color: var(--theme-dark-green);
    font-weight: 500;
    border-radius: 5px;
    padding: 0.25rem 0.5rem;
}

.hospital-name {
    color: var(--dark-grey);
    padding: 10px 3px;
    font-weight: 500;
}

.badge-purple {
    background-color: #f5e6f1;
    color: var(--dark-purple);
    font-weight: 500;
    border-radius: 5px;
    padding: 0.25rem 0.5rem;
}

.doctor-details {
    display: flex;
    flex-wrap: wrap;
}

.doctor-details {
    overflow: hidden;
    transition: max-height 0.3s ease;
}

    .specialty,
    .languages,
    .qualifications,
    .doctor-details > * {
        padding: 10px 0px;
        color: var(--dark-grey);
    }

.toggle-details-btn {
    display: flex;
    align-items: center;
    gap: 10px;
}

.opd-table {
    width: 100%;
    border-collapse: collapse;
    font-family: Arial, sans-serif;
}

    /* Header */
    .opd-table thead th {
        background-color: var(--theme-dark-green);
        color: white;
        padding: 12px;
        text-align: left;
        font-size: 16px;
        border: 1px solid var(--dark-green);
        /* full border */
    }

    /* Odd rows */
    .opd-table tbody tr:nth-child(odd) td {
        background-color: #F8F2EE;
    }

    /* Even rows */
    .opd-table tbody tr:nth-child(even) td {
        background-color: #FFFFFF;
    }

    /* All table cells get full borders */
    .opd-table tbody td {
        padding: 12px;
        font-size: 15px;
        border: 1px solid var(--theme-dark-green);
    }

    .opd-table td:first-child {
        width: 25%;
        font-weight: 600;
    }


.btn-green {
    background-color: var(--theme-dark-green);
    color: white;
    border: 1px solid var(--theme-dark-green);
    border-radius: 25px;
    padding: 10px 15px;
}

    .btn-green:hover {
        background-color: white;
        border: 1px solid white;
        color: var(--theme-dark-green);
    }