* {
    /* Change your font family */
    font-family: "Poppins", sans-serif;
}

body {
    font-family: "Poppins", sans-serif;
    --color1: #fff;
    --color2: pink;
    background: wheat;
    min-height: 100vh; /* Set a minimum height for the body */
}

.content-table {
    border-collapse: collapse;
    margin: 46px 0px;
    font-size: 0.9em;
    min-width: 627px;
    border-radius: 5px 5px 0 0;
    overflow: hidden;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
    margin-left: 25%;
}

.content-table thead tr {
    background-color: black;
    color: #ffffff;
    text-align: left;
    font-weight: bold;
}

.content-table th,
.content-table td {
    padding: 12px 32px;
}

.content-table tbody tr {
    border-bottom: 1px solid #dddddd;
}

.content-table tbody tr:nth-of-type(even) {
    background-color: #f3f3f3;
}

.content-table tbody tr:last-of-type {
    border-bottom: 2px solid #009879;
}

.content-table tbody tr.active-row {
    font-weight: bold;
    color: #009879;
}

.btn {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-left: 240%;
}

.btn a {
    text-decoration: none;
    color: #333;
}

.btn a:hover {
    color: #fff;
    background-color: #333;
    transition: all ease 0.3s;
}

.title-box {
    background-color: wheat;
    padding: 23px;
    text-align: center;
    padding-bottom: 8px;
}

.title-box h1 {
    color: #fff;
    text-shadow: 0 0 5px #999;
    margin-top: 47px;
}

tr td {
    font-weight: 600;
    font-size: small;
}
.search{
    width: max-content;
    display:flex;
    align-items: center;
    padding: 14px;
    border-radius: 28px;
    background:#f3f3f3;
    width: auto;
    transition: background 0.25s;

}
.search:focus-within{
    background: #f1f1f1;
}
.search-input{
    font-size: 16px;
    color: #333;
    margin-left: 14px;
    outline: none;
    border: none;
    background: transparent;
    flex: 1;
}

.search-input::placeholder{
    color:rgba(0, 0, 0, 0.25)
}

@media only screen and (max-width: 600px) {
    .content-table {
        margin: 5% 10%;
        min-width: 300px; /* Adjust the minimum width for smaller screens */
    }

    .title-box {
        background-color: darkturquoise;
        padding: 23px;
        text-align: center;
        padding-bottom: 8px;
    }

    .title-box h1 {
        color: white;
        margin-top: 47px;
        transition: 0.5s;
    }

    .content-table th, .content-table td {
        padding: 12px 10px;
    }
}