﻿@import url("open-iconic/font/css/open-iconic-bootstrap.min.css");
@media print {
  .no-print .k-drawer {
    display: none;
  }
  /* Slightly reduce the font size of the compliance
     reports so it can print on only one sheet. */
  .compliance-rate-stats,
  .compliance-rate-params,
  .user-compliance-stats,
  .user-compliance-params {
    font-size: 15px;
  }
  .user-compliance-details {
    page-break-before: always;
  }
  .user-compliance-details .k-master-row {
    page-break-inside: avoid;
  }
  .user-compliance-details .k-master-row td {
    padding-bottom: 20px; /* So the text can be seen in printed columns. */
  }
}
html, body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

a, .btn-link {
  color: #0366d6;
}

.btn-primary {
  color: #fff;
  background-color: #1b6ec2;
  border-color: #1861ac;
}

.content {
  padding-top: 1.1rem;
  padding-bottom: 1.1rem;
}

.valid.modified:not([type=checkbox]) {
  outline: 1px solid #26b050;
}

.invalid {
  outline: 1px solid red;
}

.validation-message {
  color: red;
}

#maps-blazor-error-ui {
  background: lightyellow;
  bottom: 0;
  box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
  display: none;
  left: 0;
  padding: 0.6rem 1.25rem 0.7rem 1.25rem;
  position: fixed;
  width: 100%;
  z-index: 10300;
}

#maps-blazor-error-ui .warning-sign {
  font-weight: bold;
}

#maps-blazor-error-ui .maps-copy,
#maps-blazor-error-ui .maps-reload {
  cursor: pointer;
}

#maps-blazor-error-ui .copy-sign,
#maps-blazor-error-ui .reload-sign {
  text-decoration: none;
}

#maps-blazor-error-ui .k-icon {
  font-size: 20px;
}

#maps-blazor-error-ui .options {
  position: absolute;
  right: 2.15rem;
  top: 0.5rem;
}

#maps-blazor-error-ui .options .separator {
  margin: 0 10px;
}

#maps-blazor-error-ui .maps-dismiss {
  cursor: pointer;
  position: absolute;
  right: -1.45rem;
  top: 0rem;
}

.template-edit .caution {
  font-size: 1.17em;
}
.template-edit .reason {
  margin-left: 1.93em;
}

.standard-form {
  width: 800px;
}

.page-title {
  font-size: 14pt;
  margin-bottom: 10px;
}

.section-title {
  font-size: 13pt;
  margin-bottom: 10px;
}

.sortable {
  cursor: pointer;
}

.window-content {
  padding-bottom: 15px;
}

.window-buttons {
  float: right;
}

.card-margin {
  margin: 15px;
}

.k-editor .k-dropdown {
  width: 12.4em !important;
}

.k-grid-toolbar .k-pager-wrap {
  border: 0;
  flex-grow: 1;
}

.top-row .btn-link {
  color: white;
}

.yellow-icon {
  color: yellow !important;
}

.roles-dialog {
  min-width: 250px;
}

.k-window-titlebar {
  background-color: #3274CC;
  color: white;
}

.k-grid th {
  font-weight: bold;
}
.k-grid .k-button-icon {
  background: inherit;
  border: none;
  margin: auto;
}
.k-grid .k-button-icon .k-icon {
  font-size: large;
}
.k-grid .k-button-icon.k-icon.k-i-file,
.k-grid .k-button-icon.k-icon.k-i-film,
.k-grid .k-button-icon.k-icon.k-i-file-pdf,
.k-grid .k-button-icon.k-icon.k-i-file-video,
.k-grid .k-button-icon.k-icon.k-i-media-manager {
  background-color: white;
}
.k-grid .k-icon-button.k-button-md {
  background-color: transparent;
  border: 0;
  padding: 0;
}
.k-grid .k-button-solid-base.k-button-md {
  background-color: transparent;
  border: 0;
}
.k-grid .k-grid-toolbar .k-pager-wrap {
  flex-grow: unset;
}
.k-grid .k-grid-toolbar .k-pager-wrap .k-pager-info {
  display: none;
}
.k-grid .k-header > .k-cell-inner {
  margin: auto;
}
.k-grid .k-grid-pager {
  display: none;
}
.k-grid .k-command-cell span {
  display: flex;
}
.k-grid .k-menu.k-menu-horizontal:not(.k-context-menu) {
  padding: 0px;
  color: black;
  background-color: inherit;
}
.k-grid .k-menu.k-menu-horizontal:not(.k-context-menu) .k-item {
  color: black;
}
.k-grid .btn-link {
  padding: 0;
}

.maintain-policies-grid .update-policy {
  color: rgb(40, 167, 69);
  margin-right: 2px;
}
.maintain-policies-grid .edit-policy-group-allocation {
  color: rgb(0, 148, 255);
  margin-left: 2px;
}
.maintain-policies-grid .retire-policy {
  color: rgb(220, 53, 69);
  margin-left: 2px;
}
.maintain-policies-grid .rollback-policy {
  color: rgb(204, 112, 0);
  margin-left: 2px;
}
.maintain-policies-grid .just-reset-policy-views {
  /*color: rgb(101, 101, 101);*/
  color: rgb(163, 163, 163);
}
.maintain-policies-grid .reset-policy-views {
  color: rgb(40, 167, 69);
}
.maintain-policies-grid .large-icons {
  font-size: 32px;
}
.maintain-policies-grid .command-column-like-header {
  position: relative;
  bottom: 8px;
}

.k-menu-horizontal.manage-account {
  background-color: #696969;
}

.manage-account .k-link {
  color: #eaeaea;
}

.manage-account .k-link.k-menu-link.k-state-active {
  color: #ffffff;
}

td.document-type {
  text-align: center;
}
td.document-type .k-i-file,
td.document-type .k-i-film,
td.document-type .k-i-file-pdf,
td.document-type .k-i-file-video,
td.document-type .k-i-media-manager {
  font-size: 24px;
}
td.document-type .k-i-file {
  color: rgb(0, 112, 147);
}
td.document-type .k-i-file-pdf {
  color: rgb(235, 16, 0);
}
td.document-type .k-i-film,
td.document-type .k-i-file-video,
td.document-type .k-i-media-manager {
  color: rgb(234, 139, 0);
}

.k-dialog-content {
  min-width: 100px;
}

.k-window .k-dialog-content,
.k-dialog .k-dialog-content {
  max-width: 500px;
}
.k-window .k-dialog-content .k-dialog-warning,
.k-dialog .k-dialog-content .k-dialog-warning {
  color: rgb(204, 112, 0);
  font-weight: bold;
}
.k-window .k-dialog-content .session-dialog,
.k-dialog .k-dialog-content .session-dialog {
  text-align: center;
}

.video-window.k-window .k-dialog-content {
  max-width: none;
}

.overdue {
  color: rgb(201, 33, 30);
  font-weight: bold;
}

.archive-overdue {
  color: rgb(180, 167, 127);
  font-weight: bold;
}

.btn-margin {
  margin: 10px;
}

.large-icon .k-icon::before {
  font-size: x-large;
}

.k-drawer-wrapper {
  min-height: 100%;
}

.no-scroll .k-grid-content {
  overflow-y: hidden;
}
.no-scroll .k-grid-header {
  padding-right: 0 !important;
}
.no-scroll .k-grid-header-wrap {
  border-width: 0px !important;
}

.no-stripe .k-alt {
  background: inherit;
}

.info-text-icon {
  color: rgb(0, 93, 196);
  font-family: "Courier New", monospace;
  font-weight: bold;
}

.warning-text-icon {
  color: rgb(204, 112, 0);
  font-family: "Courier New", monospace;
  font-weight: bold;
}

.info-text-icon::before {
  content: "i ";
  font-size: 1.2em;
}

.warning-text-icon::before {
  content: "! ";
  font-size: 1.2em;
}

.info-text-icon.-large,
.warning-text-icon.-large,
.warning-header {
  font-size: 150%;
}

.info-text-icon.-tooltip,
.warning-text-icon.-tooltip {
  cursor: pointer;
}

.info-box {
  border: 1px solid rgb(0, 93, 196);
  margin-bottom: 20px;
  padding: 6px;
  width: 870px;
}

.warning-box {
  border: 1px solid rgb(204, 112, 29);
  margin-bottom: 20px;
  padding: 6px;
  width: 870px;
}

.info-box .box-text,
.warning-box .box-text {
  font-size: 90%;
}

.release-info-grid {
  width: 420px;
}

.config-type-grid {
  width: 240px;
}

.release-info-grid th, .config-type-grid th,
.release-info-grid td, .config-type-grid td {
  text-align: center;
}

.k-grid tbody tr.mandatory-policy {
  background-color: indianred !important;
  color: white;
}
.k-grid tbody tr.mandatory-policy:hover {
  background-color: #A44A4A !important;
  color: white;
}

.k-grid tbody tr.read-policy {
  background-color: green;
  color: white;
}
.k-grid tbody tr.read-policy:hover {
  background-color: forestgreen;
}
.k-grid tbody tr.read-policy .k-checkbox:checked {
  border-color: white;
}

.absolute-center-wrapper {
  top: 0;
  right: 0;
  width: 100%;
  height: 100vh;
  position: absolute;
  z-index: 123456;
  display: flex;
  justify-content: center;
  align-items: center;
}
.absolute-center-wrapper .absolute-center {
  position: absolute;
  top: 50%;
  right: 50%;
}

.input-width {
  width: 300px;
}

.k-grid.filterable-grid th.k-header {
  padding-right: calc(1.5em + 0.75rem + 2px + 0.5rem);
}
.k-grid .k-header,
.k-grid .k-header .k-column-title {
  white-space: normal;
}
.k-grid .k-button-icon .k-icon,
.k-grid .k-icon-button .k-icon {
  font-size: large;
}

.k-grid.no-hover-highlight tr:hover {
  background: transparent;
}

.clickable {
  cursor: pointer;
}

.text-hyperlink {
  color: #3C99DC !important;
}

.video-canvas {
  max-height: 480px;
}

.user-form {
  margin-bottom: 30px;
}

.password-btn {
  position: relative;
  top: -38px;
  right: -96.5%; /* Negative value of the password box's width. */
}

.row .k-checkbox {
  margin: 5px;
}

.row.form-checkbox {
  position: relative;
  left: 10px;
}

.k-button-icon.image-button,
.k-icon-button.image-button,
.k-image.k-button-icon {
  padding: 0;
  width: 68px;
  height: 38px;
}
.k-button-icon.image-button img,
.k-icon-button.image-button img,
.k-image.k-button-icon img {
  border-radius: inherit;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 1px;
}

body:has(#pdfViewer) {
  /* Hide any extra bit of white space under the PDF container
     that may cause a second scroll bar to appear. */
  overflow: hidden;
}

.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  /* Set the fixed height of the footer here. */
  height: 60px;
  line-height: 60px; /* Vertically center the text there. */
}

.menu-footer {
  position: absolute;
  bottom: 0;
  width: 240px; /* Same width as the left vertical menu (side bar).*/
}

.ext-login-footer {
  margin-top: 20px;
  width: 240px;
}

.public-policies-footer {
  position: fixed;
  bottom: 0;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  /* Set the fixed height of the footer here. */
  height: 60px;
  line-height: 60px; /* Vertically center the text there. */
}

.envelope-blue {
  color: rgb(80, 137, 212);
}

.guest-user-gateway {
  padding: 6px 12px;
}

.small-input .k-widget {
  width: 12.4em !important;
}

.inline-checkbox {
  display: flex !important;
}
.inline-checkbox label.force-align {
  left: 5px;
  margin-right: 5px;
  position: relative;
}
.inline-checkbox input {
  margin: 4px;
}

.center-text {
  text-align: center !important;
}

.confirm-dialog-buttons {
  padding-top: 1rem;
  text-align: end;
}

.k-button .k-menu-link {
  padding: 0;
}
.k-button .k-menu-link .k-i-more-horizontal {
  margin: 0;
}
.k-button .k-menu-link .k-i-arrow-60-down {
  display: none;
}

.margin-left {
  margin-left: 4px;
}

.margin-top {
  margin-top: 5px;
}

.compliance-rate-chart,
.user-compliance-chart {
  margin: auto;
}

/*.k-chart.compliance-rate-chart,
  .k-chart.user-compliance-chart {
    text {
        cursor: pointer;
    }
}*/
.k-window .k-form-horizontal {
  min-width: 600px;
}

.k-iframe {
  width: 100%;
}

.k-dialog-content .k-form-label {
  white-space: nowrap;
}

.k-dialog-content .k-form-field {
  margin-right: 10px;
}

/*
    Emulates just what's needed from input-group, so the default
    dimensions can apply when password fields are involved.
*/
.password-group {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
}

.k-textbox.k-input {
  width: 500px;
}

.k-window .k-textbox.k-input {
  width: 350px;
}
.k-window .single-field-editor.k-textbox.k-input {
  width: 460px;
}

.k-textarea.k-input {
  width: 500px;
}

.k-grid-search.k-input {
  width: 160px;
}

.k-combobox.k-input {
  width: 500px;
}

.k-multiselect.k-input {
  width: 500px;
}

.k-dropdownlist {
  width: 500px;
}

.k-filter-menu .k-dropdownlist {
  width: 200px;
}

.k-numerictextbox.k-input {
  width: 100px;
}

.k-datepicker.k-input {
  width: 150px;
}

.force-column-title-display .k-header .k-cell-inner {
  display: block;
}

.k-grid.no-filter .k-header {
  padding-right: 6px;
}

.k-grid.no-filter .k-header .k-link {
  padding: 0;
}

.k-grid.no-filter .k-header .email-label {
  padding: 0;
  position: relative;
  top: 1px;
}

.k-grid.no-filter .k-header .k-cell-inner,
.k-grid.no-filter .k-header .email-label,
.k-grid.no-filter .k-grid-content .k-master-row,
.k-grid.verbose-grid .k-header .k-cell-inner,
.k-grid.verbose-grid .k-header .email-label,
.k-grid.verbose-grid .k-grid-content .k-master-row,
.k-grid.verbose-grid .k-header.command-column-header,
.k-grid.verbose-grid .k-header .command-column-like-header {
  font-size: 13px; /* Font size is reduced as an attempt to accommodate on small screens
   "verbose" tables with many columns and/or potentially many rows. */
}

.k-header.k-filterable {
  padding-right: 8px;
}

.k-button-solid-primary {
  background-color: #0d6efd;
  border-color: #0d6efd;
}

.maps-background {
  background-color: #696969;
}

.maps-background .navbar-brand, .maps-background .navbar-brand:hover {
  color: white;
}

.error-messages {
  color: #ff0000;
}

span.user-policy-group.-active,
span.user-policy-group.-active label {
  /* Nothing for now. */
}

span.user-policy-group.-disabled,
span.user-policy-group.-disabled label {
  color: #c4c4c4;
}

/* Forces the Policy Group drop-down such as the one in Settings > Users > Add User
   to appear styled as expected in case of custom validation errors. This has to be
   enforced sometimes when the drop-down is not directly or not exclusively bound
   to the field that is validated when the selected value changes.

   Note also that it is k-valid and not k-invalid that is specified here. It's because
   the drop-down is not automatically assigned the correct validation class when a
   custom error arises, hence why it has to be emulated.
*/
div.k-form-field-error span.k-dropdownlist.k-valid.k-picker[data-val-id=groupList] {
  border-color: #dc3545 !important;
}

div.k-form-field-error div.text-area-char-counter {
  color: #dc3545;
}

.k-form-warning {
  color: rgb(204, 112, 0);
  display: flex;
  font-size: 12px;
  font-style: normal;
}
.k-form-warning.-username {
  margin-top: 4px;
}

div.k-form-warning {
  width: 500px;
}

.upload-bar {
  height: 8px;
  width: 500px;
}

.upload-bar.-failure,
.upload-bar.-awaiting {
  border: 1px solid #b3b3b3;
  height: 4px;
  margin: 11px 0 11px 0;
}

.upload-bar.-failure {
  background-color: #dc3545;
}

.upload-bar.-awaiting {
  background-color: transparent;
}

.upload-msg {
  /* Nothing for now. */
}

.upload-msg.-failure {
  color: #dc3545;
}

.user-compliance-params ul.paramList {
  margin: 0;
  padding: 0 0 0 20px;
}

.user-compliance-notes {
  position: absolute;
  top: 150px;
  left: 840px;
}

/*
    Readjustments of vertical alignments for the command column headers.
    This is not straighforward because Telerik does not currently provide an easy way to style
    or customise those via a Class attribute or a HeaderTemplate.
    So, to avoid any convoluted JavaScript solution and yet stick to CSS, we're making one of
    two assumptions here:

    1) The command column is never sortable (condition currently imposed by Telerik)
       and therefore that column is not assigned any aria-sort attribute. This solution
       provides greater flexibility for grids whose columns are all sortable but that one.

    -- OR --

    2) The command column is always the last in the grid. This solution provides greater flexibility
       for grids that will always follow that convention, regardless of the number of sortable columns.

    Prefer padding over relative positioning as the latter tends to move the cell borders along with its text,
    which is rarely desirable.
*/
/*.users-grid.has-command-column th:not([aria-sort]),*/
.users-grid.has-command-column-last th:last-child {
  padding-bottom: 50px;
}

/*.has-command-column th:not([aria-sort]),*/
.has-command-column-last th:last-child {
  padding-bottom: 16px;
}


.no-bullets {
    list-style-type: none;
    padding-left: 0;
}