@import '../../style/vars.import.css';

:root {
  /* Styling */
	--polly-label-background: var(--polly-brand--100);
  --polly-label-background--hover: var(--polly-brand--200);
  --polly-label-background-success: var(--polly-success--500);
  --polly-label-background-success--hover: var(--polly-success--600);
  --polly-label-background-info: var(--polly-brand--100);
  --polly-label-background-info--hover: var(--polly-brand--200);

  /* Font */
	--polly-label-font-color: var(--polly-font-colour--white);
	--polly-label-font-size: var(--polly-font-size--sm);
  --polly-label-font-weight: var(--polly-font-weight--regular);

  /* Border */
	--polly-label-border-color: var(--polly-brand--100);
	--polly-label-border-radius: var(--polly-border-radius--sm);
	--polly-label-border-width: var(--polly-border-width--sm);

  /* Line Height */
  --polly-label-line-height: var(--polly-line-height--md);
}

/* Labels */

.label {
  display: inline;
  font-size: 75%;
  font-weight: 700;
  line-height: var(--polly-label-line-height);
  color: var(--polly-label-font-color);
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: var(--polly-label-border-radius);
  background: var(--polly-label-background);
  border: var(--polly-label-border-width) solid var(--polly-label-border-color);
  padding: 0.2em 0.6em 0.3em;
}


a.label:hover,
a.label:focus {
  color: var(--polly-label-font-color);
  text-decoration: none;
  cursor: pointer;
}

.label-default {
  margin-right: 0.5em;
  padding-top: 0.3em;
  background: var(--polly-label-background);
  color: var(--polly-label-font-color);
  border: 1px solid var(--polly-label-border-color);
  text-shadow: none;
  display: inline-block;
  font-weight: var(--polly-label-font-weight);
  border-radius: var(--polly-label-border-radius);
}
.label-default[href]:hover,
.label-default[href]:focus {
  background-color: var(--polly-label-background--hover);
}

.label-success {
  background: var(--polly-label-background-success);
}
.label-success[href]:hover,
.label-success[href]:focus {
  background: var(--polly-label-background-success--hover);
}

.label-info {
  background: var(--polly-label-background-info);
}
.label-info[href]:hover,
.label-info[href]:focus {
  background: var(--polly-label-background-info--hover);
}

label {
  display: inline-block;
  font-size: 12px;
  font-weight: var(--polly-label-font-weight);
  line-height: var(--polly-label-line-height);
  margin: 10px 0px 5px 0px;
  text-rendering: optimizelegibility;
}

label {
  max-width: 100%;
}

.fault-image-description {
	padding-top: 4px;
	padding-left: 4px;
  z-index: 200;
  display: block;
  position: relative;
  color: white;
	background: rgb(220, 126, 3);
}

.file-issue-icon {
  margin-left: 1em;
  color: var(--polly-error--500);
  font-weight: 500;
}