/* ===== General Layout ===== */
body {
    background-color: #f8f9fa; /* light gray background */
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}

h1, h2, h3 {
    color: #343a40; /* dark gray headings */
}

/* ===== Navbar ===== */
.navbar {
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* ===== Cards (Homepage) ===== */
.card {
    transition: transform 0.2s, box-shadow 0.2s;
}
.card:hover {
    transform: translateY(-5px);
    box-shadow: 0 6px 12px rgba(0,0,0,0.15);
}

/* ===== Forms ===== */
form input, form select, form textarea {
    border-radius: 4px;
    border: 1px solid #ced4da;
}

form button {
    min-width: 120px;
}

/* ===== Tables ===== */
table {
    background-color: #ffffff;
}
table th {
    background-color: #343a40;
    color: #ffffff;
}
table td, table th {
    padding: 0.5rem;
    text-align: left;
}

/* ===== Buttons ===== */
.btn-primary {
    background-color: #007bff;
    border-color: #007bff;
}
.btn-primary:hover {
    background-color: #0056b3;
    border-color: #0056b3;
}

.btn-success {
    background-color: #28a745;
    border-color: #28a745;
}
.btn-success:hover {
    background-color: #1e7e34;
    border-color: #1e7e34;
}

.btn-secondary {
    background-color: #6c757d;
    border-color: #6c757d;
}
.btn-secondary:hover {
    background-color: #5a6268;
    border-color: #5a6268;
}

/* ===== Pre / Result Boxes ===== */
pre {
    background-color: #e9ecef;
    padding: 1rem;
    border-radius: 5px;
    overflow-x: auto;
}

/* ===== Footer spacing ===== */
a.btn.mt-3 {
    margin-bottom: 20px;
}