
@keyframes waiting {
from { background-position-x: 100%;
}
to { background-position-x: -100%;
}
}
.xwiki-loader {
  width: 100%;
  height: 100%;
  min-height: 1rem;
  animation: waiting 2s linear infinite;
  background: linear-gradient(135deg, transparent 25%, @panel-default-heading-bg 50%, transparent 75%);
  background-repeat: repeat;
  background-size: 200% 100%;
}



.icon-placeholder {
  width: 1em;
  height: 1em;
}


.livedata-base-action {
  cursor: pointer;
  padding: 0.2em;
}



.livedata-displayer {
  display: inline-block;
  width: 100%;
  height: 100%;
  min-height: 1em;
  word-break: break-word;
}

/*
  Make any direct child of the displayer (so its Viewer or Editor widget)
  to take the full size of its parent
*/
.livedata-displayer > * {
  width: 100%;
  height: 100%;
}
.livedata-displayer:focus {
  /*
    TODO: make the outline match existing focused input outline
    (need access to Less variables for consistency)
  */
  outline: 2px lightblue solid;
  position: relative;
}

/* style for the default input */
.livedata-displayer .default-input {
  width: 100%;
}
.displayer-actions-popover > div {
  width: 100%;
  height: auto;
  min-height: 1em;
  display: inline-block;
}


.displayer-actions-popover .tippy-content {
  font-size: 1.3rem;
.displayer-action-list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: right;
}
}


.tippy-tooltip.light-border-theme{background-color:#fff;background-clip:padding-box;border:1px solid rgba(0,8,16,.15);color:#26323d;box-shadow:0 3px 14px -.5px rgba(0,8,16,.08)}.tippy-tooltip.light-border-theme .tippy-backdrop{background-color:#fff}.tippy-tooltip.light-border-theme .tippy-arrow:after,.tippy-tooltip.light-border-theme .tippy-arrow:before,.tippy-tooltip.light-border-theme .tippy-roundarrow:after,.tippy-tooltip.light-border-theme .tippy-roundarrow:before{content:"";position:absolute;z-index:-1}.tippy-tooltip.light-border-theme .tippy-roundarrow{fill:#fff}.tippy-tooltip.light-border-theme .tippy-roundarrow:after{background-image:url(data:image/svg+xml;base64,PHN2ZyBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGZpbGwtcnVsZT0iZXZlbm9kZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEuNDE0IiB2aWV3Qm94PSIwIDAgMTggNyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMCA3czIuMDIxLS4wMTUgNS4yNTMtNC4yMThDNi41ODQgMS4wNTEgNy43OTcuMDA3IDkgMGMxLjIwMy0uMDA3IDIuNDE2IDEuMDM1IDMuNzYxIDIuNzgyQzE2LjAxMiA3LjAwNSAxOCA3IDE4IDd6IiBmaWxsPSIjMzMzIiBmaWxsLW9wYWNpdHk9Ii4yMzUiIGZpbGwtcnVsZT0ibm9uemVybyIvPjwvc3ZnPg==);background-size:18px 7px;width:18px;height:7px;left:0;top:0;fill:rgba(0,8,16,.15)}.tippy-tooltip.light-border-theme[x-placement^=top] .tippy-roundarrow:after{top:1px;-webkit-transform:rotate(180deg);transform:rotate(180deg)}.tippy-tooltip.light-border-theme[x-placement^=top] .tippy-arrow{border-top-color:#fff}.tippy-tooltip.light-border-theme[x-placement^=top] .tippy-arrow:after{border-top:7px solid #fff;top:-7px}.tippy-tooltip.light-border-theme[x-placement^=top] .tippy-arrow:before{border-top:7px solid rgba(0,8,16,.2);bottom:-1px}.tippy-tooltip.light-border-theme[x-placement^=bottom] .tippy-roundarrow:after{top:-1px}.tippy-tooltip.light-border-theme[x-placement^=bottom] .tippy-arrow{border-bottom-color:#fff}.tippy-tooltip.light-border-theme[x-placement^=bottom] .tippy-arrow:after{border-bottom:7px solid #fff;bottom:-7px}.tippy-tooltip.light-border-theme[x-placement^=bottom] .tippy-arrow:before{border-bottom:7px solid rgba(0,8,16,.2);bottom:-6px}.tippy-tooltip.light-border-theme[x-placement^=left] .tippy-roundarrow:after{left:1px;top:0;-webkit-transform:rotate(90deg);transform:rotate(90deg)}.tippy-tooltip.light-border-theme[x-placement^=left] .tippy-arrow{border-left-color:#fff}.tippy-tooltip.light-border-theme[x-placement^=left] .tippy-arrow:after{border-left:7px solid #fff;left:-7px}.tippy-tooltip.light-border-theme[x-placement^=left] .tippy-arrow:before{border-left:7px solid rgba(0,8,16,.2);left:-6px}.tippy-tooltip.light-border-theme[x-placement^=right] .tippy-roundarrow:after{left:-1px;top:0;-webkit-transform:rotate(-90deg);transform:rotate(-90deg)}.tippy-tooltip.light-border-theme[x-placement^=right] .tippy-arrow{border-right-color:#fff}.tippy-tooltip.light-border-theme[x-placement^=right] .tippy-arrow:after{border-right:7px solid #fff;right:-7px}.tippy-tooltip.light-border-theme[x-placement^=right] .tippy-arrow:before{border-right:7px solid rgba(0,8,16,.2);right:-6px}.tippy-tooltip.light-border-theme[x-placement^=bottom] .tippy-arrow,.tippy-tooltip.light-border-theme[x-placement^=bottom] .tippy-roundarrow,.tippy-tooltip.light-border-theme[x-placement^=top] .tippy-arrow,.tippy-tooltip.light-border-theme[x-placement^=top] .tippy-roundarrow{-webkit-transform:translateX(-1px);transform:translateX(-1px)}.tippy-tooltip.light-border-theme[x-placement^=bottom] .tippy-arrow:after,.tippy-tooltip.light-border-theme[x-placement^=bottom] .tippy-arrow:before,.tippy-tooltip.light-border-theme[x-placement^=top] .tippy-arrow:after,.tippy-tooltip.light-border-theme[x-placement^=top] .tippy-arrow:before{left:-7px;border-left:7px solid transparent;border-right:7px solid transparent}.tippy-tooltip.light-border-theme[x-placement^=left] .tippy-arrow,.tippy-tooltip.light-border-theme[x-placement^=left] .tippy-roundarrow,.tippy-tooltip.light-border-theme[x-placement^=right] .tippy-arrow,.tippy-tooltip.light-border-theme[x-placement^=right] .tippy-roundarrow{-webkit-transform:translateY(-1px);transform:translateY(-1px)}.tippy-tooltip.light-border-theme[x-placement^=left] .tippy-arrow:after,.tippy-tooltip.light-border-theme[x-placement^=left] .tippy-arrow:before,.tippy-tooltip.light-border-theme[x-placement^=right] .tippy-arrow:after,.tippy-tooltip.light-border-theme[x-placement^=right] .tippy-arrow:before{top:-7px;border-top:7px solid transparent;border-bottom:7px solid transparent}

.livedata-advanced-panel .panel-heading {
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: stretch;
  padding: 0;
}
.livedata-advanced-panel .panel-heading .title {
  padding: 10px 15px;
}
.livedata-advanced-panel .actions {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: stretch;
}
.livedata-advanced-panel .actions .action {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 15px;
  cursor: pointer;
}



.draggable-item  {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}
.draggable-item .handle {
  padding: 6px;
  cursor: pointer; /* IE */
  cursor: grab;
  opacity: 0;
}
.draggable-item:hover .handle {
  opacity: 1;
  transition: opacity 0.2s;
}
.draggable-item .handle .fa {
  vertical-align: middle;
}

/* Responsive mode */
@media screen and (max-width: @screen-xs-max) {
.draggable-item .handle {
    /* Always show the drag handle on small screens because we can't rely on hover. */
    opacity: 1;
}
}



.livedata-advanced-panel-properties .property {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}
.livedata-advanced-panel-properties .handle {
  padding: 6px;
  cursor: pointer; /* IE */
  cursor: grab;
  opacity: 0;
}
.livedata-advanced-panel-properties .property:hover .handle {
  opacity: 1;
  transition: opacity 0.2s;
}
.livedata-advanced-panel-properties .visibility {
  padding: 6px 1rem;
}
.livedata-advanced-panel-properties .visibility input {
  margin: 0px;
}
.livedata-advanced-panel-properties .property-name {
  padding: 6px 0px;
}

/* Responsive mode */
@media screen and (max-width: @screen-xs-max) {
.livedata-advanced-panel-properties .handle {
    /* Always show the drag handler on small screens because we cannot rely on hover. */
    opacity: 1;
}
}



.livedata-advanced-panel-sort .sort-entry {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: .5em;
}
.livedata-advanced-panel-sort .draggable-item .handle {
  width: 3rem;
}
.livedata-advanced-panel-sort .delete-sort {
  display: inline-block;
  visibility: hidden;
  margin-left: 5px;
  padding: 6px 10px;
  border-radius: @border-radius-small;
  color: currentColor;
}
.livedata-advanced-panel-sort .sort-entry:hover .delete-sort {
  visibility: visible;
}
.livedata-advanced-panel-sort .delete-sort:hover {
  background-color: @panel-default-heading-bg;
}
.livedata-advanced-panel-sort .delete-sort:active {
  background-color: unset;
}
.livedata-advanced-panel-sort .add-sort-select {
  margin-top: 1rem;
}

/* Responsive mode */
@media screen and (max-width: @screen-xs-max) {
.livedata-advanced-panel-sort .delete-sort {
    /* Always show the delete icon on small screens because we cannot rely on hover. */
    visibility: visible;
}
}



.livedata-filter.filter-boolean .selectize-input {
  height: 100%;
  vertical-align: middle;
}


.livedata-filter .filter-date {
  width: 100%;
  height: 100%;
}



.livedata-filter.filter-list .selectize-input {
  height: 100%;
  vertical-align: middle;
}


.livedata-filter .filter-number {
  border: none;
  text-align: right;
}



.livedata-filter .filter-text {
  width: 100%;
}



.livedata-filter,
.livedata-filter-loader {
  display: inline-block;
  width: 100% !important;
  height: 100% !important;
  min-height: 1em;
}



.livedata-filter-container {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
}
.livedata-filter-container .delete-filter {
  display: inline-block;
  visibility: hidden;
  margin-left: 5px;
  padding: 6px 10px;
  border-radius: @border-radius-small;
  color: currentColor;
}
.livedata-filter-container:hover .delete-filter {
  visibility: visible;
}
.livedata-filter-container .delete-filter:hover {
  background-color: @panel-default-heading-bg;
}
.livedata-filter-container .delete-filter:active {
  background-color: unset;
}

/* Responsive mode */
@media screen and (max-width: @screen-xs-max) {
.livedata-filter-container .delete-filter {
    /* Always show the delete icon on small screens because we can't rely on hover. */
    visibility: visible;
}
}



.livedata-advanced-panel-filter .property-name {
  display: inline-block;
  margin-right: 0.5rem;
  padding: 5px;
  font-weight: bold;
}
.livedata-advanced-panel-filter .delete-filter-group {
  display: none;
  padding: 5px;
  color: currentColor;
}
.livedata-advanced-panel-filter .filter-group-title:hover .delete-filter-group {
  display: inline-block;
}
.livedata-advanced-panel-filter .draggable-item {
  margin-bottom: .5em;
}
.livedata-advanced-panel-filter .draggable-item .handle {
  width: 3rem;
}
.livedata-advanced-panel-filter .add-filter {
  margin-left: 3rem;
  display: inline-block;
  margin-top: 3px;
  font-style: italic;
}
.livedata-advanced-panel-filter .add-filter:hover {
  text-decoration: none;
}
.livedata-advanced-panel-filter .livedata-filter-group {
  margin-bottom: 1rem;
}
.livedata-advanced-panel-filter .add-filters-select {
  margin-top: 1rem;
}

/* Responsive mode */
@media screen and (max-width: @screen-xs-max) {
.livedata-advanced-panel-filter .delete-filter-group {
    /* Always show the delete icon on small screens because we can't rely on hover. */
    display: inline-block;
}
}



.livedata-advanced-panels {
  display: flex;
  flex-direction: column;
}


.livedata-topbar {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.livedata-topbar-left,
.livedata-topbar-right {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}
.livedata-dropdown-menu {
  margin-left: 1rem;
}




.livedata-dropdown-menu {
// Similar to .flat-buttons()
  .btn-default {
    background-color: @breadcrumb-bg;
    background-image: none;
    border-color: @dropdown-divider-bg;
    box-shadow: none;
    color: @dropdown-link-color;
    text-shadow: none;
}
.btn-default:hover, .btn-default:active, .btn-default:focus, .open .dropdown-toggle {
      border-color: darken(@dropdown-divider-bg, 10%);
}
}
.livedata-dropdown-menu .btn-default span {
  vertical-align: middle;
}

/*
 * The icons are not all the same width,
 * so we set a fix width for the icons
 * so that all dropdown options aligned with each others
 */
.livedata-dropdown-menu li a .fa {
  width: 1.4rem;
  text-align: center;
}



.livedata-pagination {
  color: @text-muted;
  font-size: 0.9em;
}
.livedata-pagination .pagination-indexes {
  display: inline-block;
  margin-left: 2rem;
  -moz-user-select: none;
       user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
}
.livedata-pagination .page-nav {
  padding: 0px 3px;
  color: inherit;
  cursor: pointer;
}
.livedata-pagination .page-nav.current {
  font-weight: bold;
}
.livedata-pagination .page-nav:hover {
  text-decoration: underline;
}
.livedata-pagination .page-nav:not(:hover) {
  text-decoration: none;
}
.livedata-pagination .page-nav.disabled {
  color: gray;
  cursor: default;
  text-decoration: none;
}
.livedata-pagination .pagination-page-size select {
  height: unset;
  padding: 2px 4px;
}

/* Responsive mode */
@media screen and (max-width: @screen-xs-max) {
  /* Stack the pagination elements vertically. */
.livedata-pagination {
    display: flex;
    flex-direction: column;
    text-align: right;
}

  /* Hide the page size element. */
.livedata-pagination .pagination-page-size {
    display: none;
}
.livedata-pagination .pagination-indexes {
    margin-left: 0;
}
}



.livedata-entry-selector-info-bar {
  margin-bottom: 1rem;
  padding: 12px;
  border-radius: @border-radius-base;
  background-color: @panel-default-heading-bg;
}



.livedata-entry-selector-all .btn {
  display: flex;
  align-items: center;
  background-color: unset;
}
.livedata-entry-selector-all-checkbox {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
}
.livedata-entry-selector-all-checkbox input {
  bottom: 0;
}
.livedata-entry-selector-all .caret{
  margin-left: 5px;
}




.layout-table th.draggable-item {
  display: table-cell;
  min-width: 4rem;
  padding: 8px 0 8px 4px;
}
.layout-table .column-name {
  display: flex;
  justify-content: space-between;
}
.layout-table .draggable-item .resize-handle {
  position: absolute;
  right: 0;
  top: 0.5rem;
  bottom: 0.5rem;
  /* TODO: Discussion about the exact display of resize handles.
      See https://jira.xwiki.org/browse/XWIKI-21816 */
  opacity: 0;
  padding: 0;
  cursor: col-resize;
  min-width: 0;
  width: 0;
  border-width: 2px;
  border-radius: 0;
  margin-left: 2px;
}
.layout-table .draggable-item:focus-within .resize-handle,
.layout-table .draggable-item:hover .resize-handle {
  opacity: 1;
  border-color: @text-muted;
  border-width: 3px;
  margin-left: 0;
}
.layout-table .draggable-item:not(:last-child) .resize-handle {
  margin-right: -2px;
}
.layout-table .draggable-item:not(:last-child):focus-within .resize-handle,
.layout-table .draggable-item:not(:last-child):hover .resize-handle {
  margin-right: -3px;
}
.layout-table .draggable-item .handle {
  opacity: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  background: transparent;
  border: 0;
  text-align: left;
}
.layout-table .sort-icon {
  color: currentColor;
  opacity: 0;
  padding-left: @table-cell-padding;
  cursor: pointer;
}
.layout-table .property-name + .sort-icon {
  vertical-align: baseline;
}
.layout-table .sort-icon.sorted {
  opacity: 1;
}
.layout-table .column-name:hover .sort-icon:not(.sorted),
.layout-table .column-name:focus-within .sort-icon:not(.sorted) {
  opacity: 0.5;
}
.draggable-container.column-header-names .draggable-item {
  position: relative;
}

/* Responsive mode */
@media screen and (max-width: @screen-xs-max) {
.layout-table th.draggable-item {
    /* Overwrite the draggable-item display in order to show the property names (table header) as a column. */
    display: block;
    /* Trim long property names. */
.property-name {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
}
}
.layout-table .resize-handle {
    /* The columns cannot be resized in responsive mode. */
    display: none;
}
}



.layout-table .column-filters th {
  padding: 2px;
  font-weight: normal;
  vertical-align: middle;
}
.layout-table .column-filters th.entry-selector {
  width: 0;
}

/* Responsive mode */
@media screen and (max-width: @screen-xs-max) {
.layout-table .column-filters th {
    /* Overwrite the filters width so they don't overflow the table. */
    width: 100%;
    border-top: none;
}
}



.livedata-entry-selector {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
}
.livedata-entry-selector input {
  bottom: 0;
}



.displayer-actions .action {
  color: @text-muted;
  white-space: nowrap;
  text-transform: capitalize;
}
.displayer-actions .action + .action {
  margin-left: .5em;
}
.displayer-actions .action-name {
  margin-left: .25em;
}



input[data-v-1711e873] {
  /* Set a fixed checkbox size to prevent it to be as large as the cell it is in. */
  width: 16px;
  height: 16px;
}
div.displayer-boolean[data-v-1711e873] {
  text-align: center;
}


.livedata-displayer .editor-date {
  width: 100%;
}
.displayed-date {
  min-width: 100%;
  min-height: 100%;
}



.livedata-displayer.displayer-link .explicit-empty-value {
  font-style: italic;
  color: grey;
}




/*
 * Fix the styles of some known HTML widgets that may be used with the HTML displayer.
 */
.xwiki-livedata .displayer-html .breadcrumb {
  margin: 0;
  padding: 0;
  background-color: transparent;

  /* Make the last segment of the breadcrumbs the same color as the rest of the segments. */
.active a {
    color: @link-color;
}
}


.livedata-displayer.displayer-number {
  text-align: right;
}



.layout-table .livedata-entry-selector {
  align-items: flex-start;
  padding: 10px 2rem;
}
.layout-table .entry-selector {
  padding: 0;
  height: 100%;
  width: 0;
}
.layout-table td.cell {
  /* Sets the height to 100% to allow children div to use the full cell height 
  (see https://stackoverflow.com/a/18488334/657524). */
  height: 100%;
}


.layout-table-new-row a {
  display: inline-block;
  width: 100%;
}
.layout-table-new-row a .fa {
  display: inline-block;
  margin-right: 0.5rem;
}



@keyframes waiting {
0% {
    left: 0; right: unset;
    width: 0%;
}
50% {
    left: 0; right: unset;
    width: 100%;
}
51% {
    left: unset; right: 0;
    width: 100%;
}
100% {
    left: unset; right: 0;
    width: 0%;
}
}
.layout-loader {
  position: relative;
  width: 100%;
  height: 0.4rem;
  visibility: hidden;
}
.layout-loader .loader-fill {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: @btn-primary-bg;
}
.layout-loader.waiting.visible {
  visibility: visible;
}
.layout-loader.waiting.visible .loader-fill {
  visibility: visible;
  animation: waiting 2s linear infinite;
}



.layout-table-wrapper {
  overflow: auto;
}
.layout-table {
table {
    height: 100%;
}
th {
    border-bottom: unset;
}
.livedata-entry-selector-all .btn {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding-left: 2rem;
}
}

/* Responsive mode */
@media screen and (max-width: @screen-xs-max) {
.layout-table .responsive-table > thead {
    /* Show the table header to allow reordering the properties, sorting and filtering the entries. We use flex display
      because we have two rows, property names and filters, that we want to display as two equally sized columns. */
    display: flex;
> tr {
      /* We want the property names column to have the same width as the filter column. */
      flex: 1;
      /* We need to set the width in order to be able to trim long property names. */
      width: calc(50vw - @grid-gutter-width);
}
}
}
.noentries-table {
  text-align: center;
  color: @text-muted;
  width: 100%;
  padding-bottom: 1em;
}


.footnotes .footnote[data-v-19edcf7a] {
  padding: 0.1em 1em;
}

