html {
  font-size: 14px;
}

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

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

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

/*body {
  margin-bottom: 60px;
}*/

:root {
    --kendo-font-size: 14px;
    --kendo-font-size-xs: 12px;
    --kendo-font-size-sm: 13px;
    --kendo-font-size-md: 14px;
    --kendo-font-size-lg: 15px;
    --kendo-font-size-xl: 16px;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* styles for validation helpers */
.field-validation-error {
    color: #b94a48;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #b94a48;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

.validation-summary-errors {
    color: #b94a48;
}

.validation-summary-valid {
    display: none;
}

.k-window-titlebar {
    padding: 10px!important;
}
.k-window-content {
    padding: 10px!important;
}

.k-table-td {
    padding: 6px!important;
}

.k-table-th.k-header {
    padding: 6px;
}
.k-grid .k-grid-md .k-grouping-header, .k-grid-md .k-grouping-header {
    padding: 3px 0px 3px 10px;
}
.k-icon.k-svg-icon.k-svg-i-trash.k-button-icon {
    margin-top: -3px;
}

.k-dropdownlist[aria-expanded="true"] {
    background-color: #0072c6 !important;
    color: white;
}

.fa-lg {
    font-size: 1.5em;
    width: 27px !important;
}

.k-menu .k-item > .k-link {
    padding: 0.5em 1.1em 0.4em 0.5em;
    font-size: 15px;
    margin-right: 0px;
}

/* === Base Kendo Menu === */
.k-menu {
    background: transparent;
    border: none;
    box-shadow: none;
}

/* === Top-level items === */
.k-menu:not(.k-context-menu) > .k-item {
    display: flex;
    align-items: center;
    justify-content: flex-start; /* left align everything */
    gap: 10px;
    color: white;
    font-weight: 500;
    padding: 0px 0px;
    transition: background-color 0.2s ease, color 0.2s ease;
    cursor: pointer;
}

/* === Hover & active === */
.k-menu- > .k-link,
.k-menu:not(.k-context-menu) > .k-item:hover,
.k-menu:not(.k-context-menu) > .k-item.k-focus {
    background-color: rgba(255, 255, 255, 0.1);
    color: #ffffff;
}

.k-menu:not(.k-context-menu) > .k-item.k-active {
    background-color: #0078d4;
    color: #ffffff;
}

/* === Expand arrow icons === */
.k-menu-expand-arrow,
.k-menu-expand-arrow .k-icon,
.k-menu-expand-arrow .k-svg-icon {
    color: black;
    opacity: 0.8;
    margin-left: auto; /* push to the right */
    margin-right: 5px;
    filter: brightness(1.2);
    transition: transform 0.2s ease, opacity 0.2s ease;
}

.k-item.k-active > .k-menu-expand-arrow {
    transform: rotate(90deg);
}

.k-menu-expand-arrow:hover {
    opacity: 1;
}

/* === Submenu popup === */
.k-animation-container .k-menu-group {
    background-color: rgb(32, 36, 49);
    border: 1px solid rgba(255, 255, 255, 0.08);
    padding: 6px 0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
}

.k-menu-group .k-item > .k-link {
    color: white;
}

/* === Submenu items === */
.k-animation-container .k-menu-group .k-item {
    color: white;
    font-weight: 400;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    padding: 2px 6px;
    background: transparent;
    transition: background-color 0.2s ease, color 0.2s ease;
}

/* === Fix white boxes inside submenu === */
.k-animation-container .k-menu-group .k-link {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* === Submenu hover === */
.k-animation-container .k-menu-group .k-item:hover,
.k-animation-container .k-menu-group .k-item.k-focus,
.k-item .k-menu-item {
    background-color: rgba(255, 255, 255, 0.1);
    color: #ffffff;
}

/* === Icons === */
.k-menu .k-icon,
.k-menu .k-svg-icon {
    filter: invert(90%);
    opacity: 0.9;
    width: 18px;
    height: 18px;
}

/* === Focus ring for accessibility === */
.k-menu .k-item:focus-visible {
    outline: 2px solid #4fa3ff;
    outline-offset: 2px;
}

/* === Optional: cleaner animation === */
.k-animation-container {
    transition: opacity 0.2s ease, transform 0.2s ease;
    transform-origin: top left;
}

/* === Optional: better submenu arrow spacing === */
.k-item > .k-link {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
}

.k-chart-tooltip {
    color: black;
}

.k-menu .k-menu-group .k-item > .k-link {
    font-size: 14px;
}

.k-menu-group .k-item > .k-link:hover,
.k-menu-group .k-item > .k-link.k-active {
    color: white;
}

.k-animation-container .menu-offset,
.k-animation-container-shown .menu-offset {
    margin-top: 10px; /* down */
    margin-left: -20px; /* left */
}