body {
    font-family: Arial, sans-serif;
    background-color: #f5f5f5;
    margin: 0;
    background-color: #f4f4f4;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'%3E%3Cg fill-rule='evenodd'%3E%3Cg fill='%23dcdcdc' fill-opacity='0.34'%3E%3Cpath d='M0 38.59l2.83-2.83 1.41 1.41L1.41 40H0v-1.41zM0 1.4l2.83 2.83 1.41-1.41L1.41 0H0v1.41zM38.59 40l-2.83-2.83 1.41-1.41L40 38.59V40h-1.41zM40 1.41l-2.83 2.83-1.41-1.41L38.59 0H40v1.41zM20 18.6l2.83-2.83 1.41 1.41L21.41 20l2.83 2.83-1.41 1.41L20 21.41l-2.83 2.83-1.41-1.41L18.59 20l-2.83-2.83 1.41-1.41L20 18.59z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    padding: 0;
}

.container {
    width: 50%;
    margin: 20px auto;
    background-color: #ffffff;
    padding: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.alert{
    color: #ff0000;
}
.alert-success{
    color: #1cdf46 !important;
}


label {
    font-weight: bold;
    margin-right: 10px;
}

input[type="text"], select {
    width: 95%;
    padding: 10px;
    margin: 10px 0;
    border: 1px solid #ddd;
    border-radius: 4px;
}

 .btn {
    padding: 10px 20px;
    background-color: #007BFF;
    color: #ffffff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    margin-top: 10px;
    margin-bottom: 10px;
    display: inline-block; 
}

 .btn:hover {
    background-color: #0056b3;
}


.btn-delete {
    padding: 10px 20px;
    background-color: #ff0000; 
    color: #ffffff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    margin-top: 10px;
    display: inline-block; 
}

.btn-success{
    padding: 10px 20px;
    background-color: #1cdf46; 
    color: #ffffff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    margin-top: 10px;
    display: inline-block; 
}
.btn-success:hover{
    background-color: #30c550; 
    
}
.btn-delete:hover {
    background-color: #cc0000; 
}

a {
    text-decoration: none;
    color: #007BFF;
    margin-right: 10px;
}


ul {
    list-style-type: none;
    padding: 0;
    margin: 0px;
}

ul li {
    padding: 10px;
    background-color: #ffffff;
    border-bottom: 1px solid #e0e0e0;
}

h1 {
    font-size: 24px;
    margin-bottom: 20px;
}
.nav-bar{
    display: flex;
    justify-content: space-between;
    text-align: center;
    align-items: center;
    width: 54%;
    margin: 10px auto;
}




.pagination {
    display: flex;
    justify-content: center;
    padding: 10px 0;
}

.page-item {
    margin-right: 5px;
}

.page-link {
    padding: 5px 10px;
    border: 1px solid #ddd;
    color: #333;
}

.page-link:hover {
    background-color: #f9f9f9;
}