body {
font-family: Arial;
margin: 0;
background: #f4f6f9;
}

.container {
max-width: 900px;
margin: auto;
padding: 15px;
}

h2 {
text-align: center;
}

input, textarea {
width: 100%;
padding: 10px;
margin: 8px 0;
}

button {
padding: 10px;
width: 100%;
background: #333;
color: white;
border: none;
}

.success { background: #d4edda; padding: 10px; }
.error { background: #f8d7da; padding: 10px; }

.card {
background: white;
padding: 15px;
margin: 10px 0;
border-radius: 8px;
}

.topbar {
display: flex;
justify-content: space-between;
padding: 10px;
background: #222;
color: white;
}

.logout {
color: white;
background: #444;
padding: 8px;
text-decoration: none;
}

.btn {
    display: inline-block;
    width: 48%;
    padding: 10px 15px;
    margin: 3px;
    border: none;
    text-decoration: none;
    text-align: center;
    border-radius: 4px;
}

.blue { background: #007bff; color: white; }
.green { background: #28a745; color: white; }
.red { background: #dc3545; color: white; }

@media (max-width:600px){
.btn { width: 100%; }
}


.map-pickup {
    background: #0d6efd;
    color: white;
}

.map-delivery {
    background: #198754;
    color: white;
}

a.btn {
    width: auto;
}