/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */

/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */

/*#region Layout styles*/
.toc {
    float: left;
    display: inline;
    margin-left: 50px;
}

.k-panelbar-item,
.k-panelbar,
.k-link {
    cursor: pointer !important;
}

.toc > ul {
    width: 90%;
    overflow-y: scroll;
    height: 650px;
}

.container {
    margin: auto;
}

html {
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 80px;
}

.k-panelbar-item-icon {
    width: 25px;
    margin-right: 5px;
}

pre {
    margin: 0;
    color: darkblue;
}

.k-searchbox {
    margin-bottom: 15px;
    font-weight: bold;
    width: 90%;
}

a.navbar-brand {
    white-space: normal;
    text-align: center;
    word-break: break-all;
}

.index-container {
    vertical-align: middle;
    text-align: center;
    width: 1180px;
    background-color: aliceblue;
    height: 820px;
}

.title-container {
    margin-bottom: 16px;
}

.k-tabstrip-content.k-active {
    height: 855px;
    width: 1215px;
    margin-bottom: 100px;
    overflow: hidden !important;
    text-align: left;
}

/* Provide sufficient contrast against white background */
a {
    color: #0366d6;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.border-top {
    border-top: 1px solid #e5e5e5;
}

.border-bottom {
    border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
    font-size: 1rem;
    line-height: inherit;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
    position: relative;
    min-height: 100%;
}

body {
    /* Margin bottom by footer height */
    margin-bottom: 60px;
}

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    white-space: nowrap;
    line-height: 60px; /* Vertically center the text there */
    margin-bottom: -50px;
}

a.navbar-brand {
    white-space: normal;
    text-align: center;
    word-break: break-all;
}

/* Provide sufficient contrast against white background */
a {
    color: #0366d6;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.border-top {
    border-top: 1px solid #e5e5e5;
}

.border-bottom {
    border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
    font-size: 1rem;
    line-height: inherit;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
    position: relative;
    min-height: 100%;
}

body {
    /* Margin bottom by footer height */
    margin-bottom: 60px;
}

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    white-space: nowrap;
    line-height: 60px; /* Vertically center the text there */
}


.calendar-container {
    vertical-align: middle;
    display: flex !important;
    justify-content: center !important; /* Centers children horizontally */

    background-color: aliceblue;
}

.cal-centered-div {
    /* Optional: define width, height, etc. */
    width: 80%;
}

.refresh-btn-container {
    vertical-align: bottom;
    display: flex !important;
    justify-content: right !important; 

    background-color: aliceblue;
}

/* For Classic RenderMode */
.rsAptDelete {
    display: none;
}

/* For Lightweight RenderMode */
.RadScheduler .rsApt .rsAptDelete {
    display: none;
}

.no-dblclick-select {
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+ and Edge */
    user-select: none; /* Standard syntax */
}

dropdown-class {
    background-color: #ddeaf0; /* Change to your desired color */
}

/* To style individual options within the dropdown */
.dropdown-class option {
    background-color: #ddeaf0; /* Example: different color for options */
    color: #000000;
}

/* Hide resize handlers for the events so it will prevent changes being made to schedule*/
.k-resize-handle, .k-resize-s {
    visibility: hidden !important;
}

.k-button-text {
    font-weight: 500 !important;
}

input[aria-controls="assigneeList_listbox"], .calendar-container, .cal-centered-div {
    background-color: #dee1e3;
    font-weight: 500;
    border: 1px groove #bbb6ba; /* Sets a 2px solid border with a dark gray color */
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3); /* Adds a shadow effect */
    padding: 5px; /* Optional: adds space inside the input */
}

input[aria-controls="assigneeList_listbox"] {


}


/* For older versions of Internet Explorer (IE) 10 and 11 */
ms-input-placeholder {
    color: #0000ff;
}

::placeholder {
    color: blue;
}

::-webkit-input-placeholder {
    color: blue;
}

::-moz-placeholder {
    color: blue;
}

:-moz-placeholder {
    color: blue;
}

.k-table-th, .k-header {
    font-weight: 500 !important;
}

.contact-address {
    margin-left: 50px;
    margin-top: 100px
}

.about-msg {
    align-content:center;
    margin-top: 100px;
}

.custom-edit-popup-element-width {
    width: 720px !important;
    box-sizing: border-box !important; /* Ensures padding and border are included in the 300px width */
    padding: 4px !important;
    border-color: #80808029 !important;

    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.expanded-view {
    margin: auto !important;
    width: 120% !important;
}

.button-with-circle {
    position: relative; /* Essential for positioning the circle relative to the button */
    padding: 10px 15px 10px 35px; /* Add padding to the left to make space for the circle */
    border: none;
    background-color: #007bff; /* Button background color */
    color: white;
    font-size: 16px;
    cursor: pointer;
    border-radius: 5px; /* Rounded corners for the button itself */
    display: inline-flex; /* Align items nicely */
    align-items: center; /* Center the items vertically */
}

.color-circle {
    position: absolute; /* Position the circle precisely within the button */
    left: 10px; /* Distance from the left edge of the button */
    top: 50%; /* Start from the vertical middle */
    transform: translateY(-50%); /* Adjust vertically to be perfectly centered */
    width: 12px; /* Diameter of the circle */
    height: 12px; /* Diameter of the circle */
    background-color: #28a745; /* The color of your circle (green in this example) */
    border-radius: 50%; /* Makes the span a perfect circle */
}

.button-with-circle:hover {
    background-color: #0056b3; /* Optional: hover effect for the button */
}

#Menu .k-menu-item .k-link:hover,
#Menu .k-menu-item.k-hover .k-link {
    background-color: #ff6358 !important; /* Your desired background color */
    color: white !important; /* Your desired text color */
}

/* For child/context menu items in a dropdown */
.k-popup .k-menu-group .k-item > .k-link.k-active,
.k-popup .k-menu-group .k-item > .k-link:hover {
    background-color: #ff6358 !important;
    color: white !important;
}


.loader-container {
    display: flex;
    justify-content: center; /* Centers horizontally */
    align-items: center; /* Centers vertically */
    height: 80vh; /* Makes the container fill the entire viewport height */
    width: 100vw; /* Makes the container fill the entire viewport width */
    position: fixed; /* Optional: overlays the loader over other content */
    top: 0;
    left: 0;
    background-color: rgba(255, 255, 255, 0.4); /* Optional: semi-transparent background */
    z-index: 1000; /* Optional: ensures the loader is on top of other content */
}

.k-loading-image, .k-loading-mask {
    display: none !important;
}

.hover-menu-item:hover {
    color: white !important;
    background-color: #ff6358 !important;
}

.error {
    color: red;
}


/* Style the tab */
.tab {
    overflow: hidden;
    border: 1px solid #ccc;
    background-color: #f1f1f1;
}

    /* Style the buttons that are used to open the tab content */
    .tab button {
        background-color: inherit;
        float: left;
        border: none;
        outline: none;
        cursor: pointer;
        padding: 14px 16px;
        transition: 0.3s;
    }

        /* Change background color of buttons on hover */
        .tab button:hover {
            background-color: #FBDCDA;
            color: #ff6358;
            font-weight: 500 !important;
            
        }

        /* Create an active/current tablink class */
        .tab button.active {
            background-color: #ff6358;
            color: #ffffff;
            font-weight: 500 !important;
        }

/* Style the tab content */
.tabcontent {
    display: none;
    padding: 6px 12px;
    border: 1px solid #ccc;
    border-top: none;
}

#grid table tr.k-master-row:hover {
    background-color: #FBDCDA !important;
    color: #ff6358 !important;
    font-weight: 500 !important;
}

#grid div.k-grid-toolbar button {
    background-color: #ff6358 !important;
    color: #ffffff !important;
    font-weight: 500 !important;
}

#userAccountAdminGrid table tr.k-master-row:hover {
    background-color: #FBDCDA !important;
    color: #ff6358 !important;
    font-weight: 500 !important;
}

#userAccountAdminGrid div.k-grid-toolbar button {
    background-color: #ff6358 !important;
    color: #ffffff !important;
    font-weight: 500 !important;
}

#userAccountAdminGrid table thead tr {
    background-color: lightgray
}

#grid table thead tr {
    background-color: lightgray
}

@media (max-width: 768px) {
    /* Target all cells within the Telerik Grid */
    .k-grid td {
        white-space: normal; /* This allows text to wrap */
        word-wrap: break-word; /* Ensures long words without spaces wrap correctly */
    }
}