body {
    height: 100% !important;
    min-height: 100% !important;
    max-height: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

.token_container {
    display: block;
}

.token_display {
    font-size: 11px;
    color: gray;
    font-family: monospace;
    word-break: break-all;
}

#password {
    width: 100%;
    font-size: 17px;
}

.form_comments textarea {
    width: 100%;
    font-size: 17px;
}

label {
    color: gray;
}

input, button, textarea {
    box-shadow: none !important;
    border: none !important;
}

.k-textbox:focus,
.k-textbox.k-focus,
.k-input:focus,
.k-input.k-focus,
.k-input-inner:focus,
.k-input-inner.k-focus {
    border-color: inherit !important;
    box-shadow: none !important;
    outline: none !important;
}

.gradient-blue {
    background: linear-gradient(135deg, #0d57f9, #0a1e5f);
}

.punch_clock_content {
    height: calc(100vh - 50px);
    position: relative;
    background-color: #e1e6f4;
    background-image: url(/img/background.png);
    background-size: cover;
}

.punch_clock_footer {
    position: fixed;
    bottom: 0;
    width: 100vw;
    margin: 0;
    background: linear-gradient(135deg, #2563eb, #1e40af);
    color: white;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.page-card {
    background: white;
    padding: 25px;
    border-radius: 15px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06);
    transition: 0.25s;
}

    .page-card h3 {
        margin: 0 0 10px;
        font-size: 1.2rem;
        color: #1e40af;
    }

.individual_header {
    background: linear-gradient(135deg, #0d57f9, #0a1e5f);
    color: white;
    padding: 80px 20px;
    text-align: center;
    height: 250px;
    box-sizing: border-box;
}

.body_with_header {
    height: calc(100% - 250px);
    display: flex;
    align-items: center;
    justify-content: center;
}

.k-button {
    background: linear-gradient(135deg, #0d57f9, #0a1e5f) !important;
    color: white !important;
}

.k-checkbox {
    border: 1px solid #0c43c3 !important;
    background-color: #0c43c3 !important;
    color: #ffffff !important;
}

.k-checkbox-label {
    color: #0c43c3 !important;
}

.admin_dashboard_header {
    background: linear-gradient(180deg, #ffffff, #f1f3f5);
    height: 32px;
    display: flex;
    justify-content: space-between; 
    align-items: center;   
    padding: 0 15px;
}

.admin_dashboard_breadcrumb {
    background-color: #cfdbed;
    height: 40px;
    padding: 4px 15px;
}

.admin_dashboard_page_name {
    margin:0;
    padding:0;
    color: #46474b;
    font-weight: bold;
}

.admin_dashboard_content {
    padding: 25px;
    box-sizing:border-box;
}

.breadcrumb_component {
    display: flex;
    align-items: center;
    gap: 8px;
    background-color: white;
    border-radius:5px;
    padding-left:10px;
}

.k-breadcrumb-link {
    color: #0c43c3 !important;

}

/* Target last menu item */
.k-menu > .k-item:last-child > .k-link {
    background-color: #ffe5e5;
    /*color: #b00020;*/
}

/* Hover */
.k-menu > .k-item:last-child > .k-link:hover {
    background-color: #ffcccc !important;
}
.CenterCommand {
    text-align: center;
}

button[title="Close"] {
    background: linear-gradient(red, rgb(109, 16, 16)) !important;
}

button[title="Close"] span {
    background: linear-gradient(red, rgb(109, 16, 16)) !important;
}

.row_active_icons {
    height: 23px !important;
    width:auto !important;
}

.k-table-td img {
    height: 23px !important;
    width:auto !important;
}