body{

font-family:Arial, Helvetica, sans-serif;
background:#f4f6f9;
margin:0;

}

/* top bar */

.topbar{

background:#1e293b;
color:white;
padding:15px 30px;

display:flex;
justify-content:space-between;
align-items:center;

}

.topbar nav a{

color:white;
text-decoration:none;
margin-left:20px;
font-size:14px;

}

.topbar nav a:hover{

opacity:0.7;

}

/* container */

.container{

padding:30px;
max-width:1000px;
margin:auto;

}

/* cards */

.card{

background:white;
padding:20px;
border-radius:8px;
box-shadow:0 2px 6px rgba(0,0,0,0.1);
margin-bottom:20px;

}

/* buttons */

button{

background:#2563eb;
border:none;
color:white;
padding:10px 18px;
border-radius:5px;
cursor:pointer;

}

button:hover{

background:#1d4ed8;

}

/* inputs */

input, select{

width:100%;
padding:10px;
margin-top:5px;
margin-bottom:15px;
border:1px solid #ddd;
border-radius:5px;

}

/* table */

table{

width:100%;
border-collapse:collapse;
background:white;

}

table th{

background:#f1f5f9;
padding:10px;
text-align:left;

}

table td{

padding:10px;
border-top:1px solid #eee;

}

/* footer */

.footer{

text-align:center;
padding:20px;
color:#777;

}