/* General styles */
body {
    font-family: Arial, sans-serif;
    background-color: #f0f2f5;   /* slightly darker background */
    margin: 20px;
    color: #333;
}

h1, h2 {
    text-align: center;
    color: #222;              /* darker text for contrast */
    background: #e0e0e0;      /* light-medium gray background */
    padding: 10px;
    border-radius: 6px;
    margin-bottom: 20px;
    border: 1px solid #ccc;   /* subtle border for definition */
}


/* Form container */
form {
    background-color: #fdfdfd;  /* light card background */
    padding: 25px;
    max-width: 1125px;
    margin: 0 auto 40px auto;
    border-radius: 10px;
    border: 2px solid #ccc;     /* define edge */
    box-shadow: 0 4px 12px rgba(0,0,0,0.15); /* stronger shadow */
    font-weight: bold;
}

/* Table styling inside form */
form table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 12px;
    table-layout: fixed;
}

/* Label cells */
form td:nth-child(odd) {
    text-align: right;
    padding-right: 10px;
    vertical-align: middle;
}

/* Input cells */
form td:nth-child(even) {
    padding-left: 10px;
}

/* Dropdowns */
form select {
    width: 100%;
    padding: 8px;
    border-radius: 4px;
    border: 1px solid #aaa;
    font-size: 14px;
    font-weight: bold;
    background-color: #fff;
    box-sizing: border-box;
}

/* Buttons */
button {
    padding: 12px 24px;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    font-size: 150%;     /* larger text */
    font-weight: bold;
    margin: 15px 12px 0px 0;  /* top right bottom left */
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

button[type="submit"] {
    background-color: #007BFF;
    color: white;
}

button[type="button"] {
    background-color: #6c757d;
    color: white;
}

button:hover {
    opacity: 0.9;
}

/* Results table */
table.results {
    table-layout: fixed;
    width: 100%;
    max-width: 1125px;         /* match form width */
    margin: 0 auto;
    border-collapse: collapse;
    background-color: #fefefe;
    border: 2px solid #007BFF;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15); /* match form shadow */
}

/* Individual column widths */
table.results th:nth-child(1),
table.results td:nth-child(1) { width: 10%; }

table.results th:nth-child(2),
table.results td:nth-child(2) { width: 13%; }

table.results th:nth-child(3),
table.results td:nth-child(3) { width: 5%; }

table.results th:nth-child(4),
table.results td:nth-child(4) { width: 11%; }

table.results th:nth-child(5),
table.results td:nth-child(5) { width: 10%; }

table.results th:nth-child(6),
table.results td:nth-child(6) { width: 6%; }

table.results th:nth-child(7),
table.results td:nth-child(7) { width: 9%; }

table.results th:nth-child(8),
table.results td:nth-child(8) { width: 8%; }

table.results th:nth-child(9),
table.results td:nth-child(9) { width: 4%; }

table.results th:nth-child(10),
table.results td:nth-child(10) { width: 9%; }

table.results th:nth-child(11),
table.results td:nth-child(11) { width: 13%; }

/* Table header */
table.results th {
    background-color: #007BFF;
    color: #fff;
    padding: 12px;
    border: 1px solid #0056b3;
    text-align: left;
    font-weight: bold;
}

/* Table cells */
table.results td {
    font-weight: bold;
    padding: 10px;
    border: 1px solid #ddd;
}

/* Alternating row colors */
table.results tr:nth-child(even) td {
    background-color: #f2f2f2;
}

table.results tr:nth-child(odd) td {
    background-color: #ffffff;
}

/* Hover effect for rows */
table.results tr:hover td {
    background-color: #d0e4ff;
}

/* Stamp links */
.qv-link {
    display: inline-block;
    color: #000000;
    text-decoration: underline;
    transition: transform 0.3s ease, color 0.3s ease;
    transform-origin: left center;
}

.qv-link:hover {
    color: darkgreen;
    font-weight: bold;
}

/* Responsive */
@media (max-width: 768px) {
    form table, table.results {
        font-size: 12px;
    }

    form td {
        display: block;
        width: 100%;
        margin-bottom: 10px;
    }

    form tr {
        display: block;
        margin-bottom: 15px;
    }

    button {
        width: 48%;
        margin-bottom: 10px;
    }
}