/* Define @font-face rule to import Sarpanch Regular font */
@font-face {
    font-family: 'Sarpanch';
    src: url('Fonts/Sarpanch-Regular.ttf') format('truetype');
    /* You can use other font formats (e.g., woff, woff2) and provide additional font weights/styles if needed */
}

/* Apply custom font to specific elements */
body {
    font-family: 'Sarpanch';
    /* Use fallback fonts if Sarpanch is not available */
    background-color: rgba(0, 0, 0, 1); /* Black background with full opacity */
    color: #ccc; /* Light gray color for text */
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh; /* Full viewport height */
    margin: 0; /* Remove default margin */
}

/* Styling for the main content container */
.container {
    background-color: rgba(0, 0, 0, 0.274); /* Dark slate gray background with 27.4% transparency */
    padding: 40px; /* Padding inside the container */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); /* Shadow effect for the container */
    text-align: center; /* Center-align text content */
    width: 400px; /* Set container width */
    border: 1px solid rgba(130, 203, 255, 1); /* 1px solid border with light blue color */
    border-radius: 0; /* Remove border radius to make corners sharp */
}

.container_adduser {
    background-color: rgba(0, 0, 0, 0); /* Dark slate gray background with 27.4% transparency */
    padding: 40px; /* Padding inside the container */
    text-align: center; /* Center-align text content */
    width: 400px; /* Set container width */
    border: 0px solid rgba(130, 203, 255, 1); /* 1px solid border with light blue color */
    border-radius: 0; /* Remove border radius to make corners sharp */
}

/* Styling for the main heading */
h1 {
    color: #ccc; /* Slate blue color for the main heading */
}

/* Styling for input groups (labels and input fields) */
.input-group {
    margin-bottom: 20px; /* Bottom margin for input groups */
}

/* Styling for labels within input groups */
label {
    display: block; /* Display labels as block elements */
    margin-bottom: 8px; /* Bottom margin for labels */
    color: #ddd; /* Light gray color for labels */
}

/* Styling for select dropdown */
select {
    width: 105.5%; /* Full width for dropdown */
    padding: 10px; /* Padding inside dropdown */
    border: 1px solid #757575; /* Darker gray border for dropdown */
    font-size: 16px; /* Font size for dropdown */
    background-color: #1d1d1d; /* Darker slate gray background for dropdown */
    color: #ccc; /* Light gray color for text inside dropdown */
    border-radius: 0; /* Remove border radius to make corners sharp */
    appearance: none; /* Remove default appearance */
    -moz-appearance: none; /* Remove default appearance for Firefox */
    -webkit-appearance: none; /* Remove default appearance for Webkit browsers */
    cursor: pointer; /* Set cursor to pointer */
}

/* Styling for dropdown options */
select option {
    background-color: #1d1d1d; /* Darker slate gray background for options */
    color: #ccc; /* Light gray color for text inside options */
}

/* Styling for labels within input groups */
label {
    display: block; /* Display labels as block elements */
    margin-bottom: 8px; /* Bottom margin for labels */
    color: #ddd; /* Light gray color for labels */
}

/* Styling for text input and number input fields */
input[type="text"],
input[type="password"],
input[type="number"] {
    width: 100%; /* Full width for text and number input fields */
    padding: 10px; /* Padding inside input fields */
    margin-bottom: 20px;
    border: 1px solid #757575; /* Darker gray border for input fields */
    font-size: 16px; /* Font size for input fields */
    background-color: #1d1d1d; /* Darker slate gray background for input fields */
    color: #ccc; /* Light gray color for text inside input fields */
    border-radius: 0; /* Remove border radius to make corners sharp */
}

/* Styling for buttons */
button {
    padding: 10px 20px; /* Padding inside buttons */
    background-color: rgba(0, 0, 0, 0.315); /* Black background with 31.5% transparency for buttons */
    color: #ccc; /* Light gray color for button text */
    border: 1px solid rgba(130, 203, 255, 1); /* 1px solid border with light blue color */
    border-radius: 0; /* Remove border radius to make corners sharp */
    cursor: pointer; /* Set cursor to pointer on hover */
    font-family: 'Sarpanch';
    font-size: 16px; /* Font size for buttons */
    transition: background-color 0.3s ease; /* Smooth transition for background color on hover */
}

/* Hover styling for buttons */
button:hover {
    background-color: rgba(0, 0, 0, 0.5); /* Darken button background on hover */
}