.custom-button {
        width: 200px; /* Set the width */
        height: 35px; /* Set the height */
        background-color: #007bff; /* Initial background color */
        color: white; /* Text color */
        border: none; /* Remove border */
        border-radius: 40px; /* Optional: Rounded corners */
        font-size: 12px; /* Adjust font size */
        cursor: pointer; /* Change cursor to pointer */
        font-size:15px;
    }

    .custom-button:hover {        
            background-color: #0056b3; /* Hover background color */
            color: #fff; /* Hover text color */                
        }

    .custom-textbox {
        width: 250px; /* Set the width of the TextBox */
        height: 35px; /* Set the height of the TextBox */
        padding: 8px; /* Padding for text inside the box */
        border-radius: 20px; /* Rounded corners */
        border: 1px solid #ccc; /* Border color */
        background-color: transparent; /* Transparent background */
        font-size: 14px; /* Font size */
        box-sizing: border-box; /* Include padding and border in width/height calculation */
        font-family:Cambria;
    }

    .custom-textbox:focus {
        border-color: #007bff; /* Border color when focused */
        outline: none; /* Remove default outline on focus */
    }

    .custom-textbox200px {
        width: 200px; /* Set the width of the TextBox */
        height: 35px; /* Set the height of the TextBox */
        padding: 8px; /* Padding for text inside the box */
        border-radius: 20px; /* Rounded corners */
        border: 1px solid #ccc; /* Border color */
        background-color: transparent; /* Transparent background */
        font-size: 14px; /* Font size */
        box-sizing: border-box; /* Include padding and border in width/height calculation */
        font-family:Cambria;
    }

    .custom-textbox200px:focus {
        border-color: #007bff; /* Border color when focused */
        outline: none; /* Remove default outline on focus */
    }

    #panel {
    border: 1px solid #ccc; /* Light gray border */
    border-radius: 10px; /* Rounded corners */
    padding: 15px; /* Space inside the panel */
    background-color: #f9f9f9; /* Light background color */
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* Subtle shadow effect */
}

   /* Style for DropDownList */
.custom-dropdown {
    width: 100%;               /* Makes the dropdown take full width of its container */
    padding: 8px 12px;         /* Adds padding for better readability */
    font-size: 14px;           /* Sets font size */
    font-family: Cambria;      /* Sets a clean font */
    border: 1px solid #007bff; /* Adds a subtle border */
    border-radius: 40px;       /* Rounds the corners */
    background-color: #fff;    /* White background */
    color: #000000 !important;    /* Force text color to black */
    box-sizing: border-box;    /* Ensures padding is included in width */
    -webkit-appearance: none;  /* Removes default arrow for webkit browsers */
    -moz-appearance: none;     /* Removes default arrow for Firefox */
}

/* Custom dropdown arrow */
.custom-dropdown-wrapper {
    position: relative;
}

.custom-dropdown-wrapper::after {
    content: '\25BC';          /* Unicode character for a downwards arrow */
    font-size: 18px;           /* Adjusts the size of the arrow */
    color: #888;               /* Sets arrow color */
    position: absolute;
    top: 50%;
    right: 12px;               /* Adjust the position of the arrow */
    transform: translateY(-50%);
    pointer-events: none;
}

/* Style for dropdown on hover */
.custom-dropdown:hover {
    border-color: #007bff;     /* Darken the border color slightly on hover */
    background-color: #f9f9f9; /* Change background color on hover */
}

/* Style for dropdown when disabled */
.custom-dropdown:disabled {
    background-color: #f0f0f0; /* Lighter background for disabled */
    color: #aaa;               /* Lighter text color */
    cursor: not-allowed;       /* Shows a not-allowed cursor */
    border: 1px solid #ddd;    /* Light border */
}

.gridview {
        collapse: separate; /* To allow border-radius */
        border-spacing: 0; /* Remove gaps between borders */
        font-family: Arial, sans-serif;
        font-size: 14px;
        color: #333;
        border-radius: 10px; /* Rounded corners for the whole table */
        /*overflow: hidden;*/ /* Ensure corners are clippe /* Ensure corners are clipped */
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Subtle shadow */
    }

    .gridview th {
        background-color: #007BFF; /* Blue header */
        color: white;
        text-align: center;
        padding: 10px;
        border: 1px solid #ccc;
    }

    .gridview td {
        padding: 8px;
        text-align: center;
        border: 1px solid #ddd;
    }

    .gridview tr:nth-child(even) {
        background-color: #f9f9f9; /* Light gray for alternate rows */
    }

    .gridview tr:nth-child(odd) {
        background-color: #ffffff; /* White for other rows */
    }

    .gridview tr:hover {
        background-color: #D6EAF8; /* Light blue hover effect */
    }

    .gridview th:first-child,
    .gridview td:first-child {
        border-top-left-radius: 10px; /* Top-left corner */
        border-bottom-left-radius: 10px; /* Bottom-left corner */
    }

    .gridview th:last-child,
    .gridview td:last-child {
        border-top-right-radius: 10px; /* Top-right corner */
        border-bottom-right-radius: 10px; /* Bottom-right corner */
    }    

    .my-gridview .left-align {
    text-align: left;
}
.rounded-panel {
    width: 300px; /* Adjust width as needed */
    padding: 20px; /* Space inside the panel */
    background-color: #f9f9f9; /* Background color */
    border: 1px solid #ccc; /* Border style */
    border-radius: 15px; /* Rounded corners */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Optional shadow for depth */
}

.footer-summary {
    padding: 15px;
    background-color: #f8f9fa;
    border-top: 2px solid #dee2e6;
    font-size: 14px;
    line-height: 1.6;
}

.long-leave-row {
    background-color: #f5f5f5;
    color: #666;
    font-style: italic;
}

.faculty-adequate {
    color: #28a745; /* Green for adequate faculty */
    font-weight: bold;
}

.faculty-deficient {
    color: #dc3545; /* Red for deficient faculty */
    font-weight: bold;
}

.gridview {
    width: 100%;
    margin-top: 20px;
}