/* Google Fonts Import */
@import url('https://fonts.googleapis.com/css2?family=Hind+Siliguri:wght@300;700&display=swap');

:root {
    --primary-black: #000000;
    --primary-white: #ffffff;
    --deep-green: #0d5d2e;
    --deep-red: #8b0000;
    --light-gray: #f8f9fa;
    --border-gray: #e9ecef;
    --text-gray: #6b6b6b;
    --font-bn: 'Hind Siliguri', sans-serif;
}

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: var(--font-bn); line-height: 1.7; color: var(--primary-black); background: var(--light-gray); overflow-x: hidden; }
.container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
a { text-decoration: none; color: inherit; }

/* Main Content Styles */
main { padding: 30px 0; min-height: calc(100vh - 350px); }
.result-container {
    background-color: white;
    padding: 40px;
    border-radius: 12px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.1);
    text-align: center;
    max-width: 600px;
    margin: 40px auto;
}
.result-container h1 { font-size: 28px; color: var(--deep-green); margin-bottom: 15px; }
.result-container p { color: var(--text-gray); margin-bottom: 30px; }

/* --- MODIFIED SECTION START --- */
.input-group {
    display: flex;
    flex-direction: column; /* Arrange items vertically */
    gap: 15px; /* Add space between input and button */
}

#rollNumber {
    width: 100%;
    border: 1px solid var(--border-gray);
    padding: 15px;
    font-size: 18px;
    outline: none;
    border-radius: 8px; /* Apply border-radius to all corners */
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
}

.input-group button {
    background-color: var(--deep-green);
    color: white;
    border: none;
    padding: 15px 30px; /* Ensure consistent padding */
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s;
    border-radius: 8px; /* Apply border-radius */
}
/* --- MODIFIED SECTION END --- */

.input-group button:hover { background-color: #0a4a25; }
#result { margin-top: 30px; font-size: 1.5em; font-weight: bold; }
#result .pass { color: var(--deep-green); } /* এখানে #result যোগ করা হয়েছে */
#result .fail { color: var(--deep-red); }   /* এখানে #result যোগ করা হয়েছে */

/* Responsive Styles */
@media (max-width: 992px) {
    .footer-content { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .result-container { padding: 30px; }
}
@media (max-width: 576px) {
    .footer-content { grid-template-columns: 1fr; }
    /* The input group is already vertical, so no major change is needed here */
}