.dmsItemDetails {
  background: none;
}
.dmsItemDetails .ms-DetailsRow {
  background: none;
}
.dmsItemDetails .ms-DetailsRow:hover {
  background: rgb(255, 255, 255);
}

.dmsItemDetailsDarkMode {
  background: none;
}
.dmsItemDetailsDarkMode .ms-DetailsRow {
  color: white;
  background: none;
}
.dmsItemDetailsDarkMode .ms-DetailsRow:hover {
  background: #2a2a2a;
  color: white;
}

.hideCaret .ms-Button {
  display: none;
}

.ms-DatePicker-goToday {
  right: 0px !important;
}

.fileTitle {
  text-overflow: ellipsis;
  overflow: hidden;
}

.clickableLink {
  cursor: pointer;
}
.clickableLink:hover {
  text-decoration: underline;
}

.fileMetadata {
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 11px;
  margin-top: 2px;
}

.deletedFileMetaData {
  color: #a7a7a7;
}

.deletedFile {
  text-overflow: ellipsis;
  overflow: hidden;
  color: #a7a7a7;
  font-size: 16px;
}

.textOverflowElipsis {
  text-overflow: ellipsis;
  overflow: hidden;
}

.sharedFileTitle {
  color: #323130;
  cursor: pointer;
  font-size: 16px;
}

.sharedFileTitle:hover {
  text-decoration: underline;
}

.preWrap {
  white-space: pre-wrap;
}

#sharedFilesDetailsList .ms-DetailsHeader {
  background-color: transparent;
}
#sharedFilesDetailsList .ms-DetailsHeader-cell:hover {
  background-color: transparent;
}

.sharedColumnTextCell,
.sharedColumnStopSharingCell {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: auto;
  height: 100%;
}
.sharedColumnTextCell div,
.sharedColumnStopSharingCell div {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  -ms-flex-item-align: center;
      align-self: center;
}
.sharedColumnTextCell button,
.sharedColumnStopSharingCell button {
  -ms-flex-item-align: center;
      align-self: center;
  margin-left: auto;
}

.darkMode {
  color: white;
  /* Main black background for panels, slight contrast difference over black */
}
.darkMode .ms-Panel-main,
.darkMode .ms-Dialog-main,
.darkMode .ms-Panel-closeButton:hover,
.darkMode .metadataPositionIcons2 * {
  background-color: #1e1e1e !important;
}
.darkMode .ms-Pivot > .ms-Pivot-link {
  color: white !important;
}
.darkMode .ms-Checkbox-checkbox {
  outline: 1px solid white;
}
.darkMode {
  /* Removal of input box white border in dark mode */
}
.darkMode .ms-ComboBox.is-disabled,
.darkMode .ms-ComboBox.is-disabled::after,
.darkMode .ms-TextField.is-disabled .ms-TextField-fieldGroup {
  border-style: none !important;
}
.darkMode {
  /* White headings, labels and icons. */
}
.darkMode .ms-Label,
.darkMode .ms-Panel-headerText,
.darkMode .ms-Panel-content,
.darkMode .ms-Checkbox-text,
.darkMode .ms-ChoiceFieldLabel,
.darkMode .ms-Dialog-header .ms-Panel-header .ms-Panel-headerText,
.darkMode .ms-SearchBox-icon,
.darkMode .ms-Dialog-header,
.darkMode .ms-Spinner-label,
.darkMode .ms-SearchBox-clearButton i,
.darkMode .ms-TextField:not(.is-disabled) .ms-Label,
.darkMode .ms-Dropdown:not(.is-disabled) > .ms-Dropdown-title,
.darkMode .ms-Dropdown:not(.darkModeLabelDisabled) .ms-Dropdown-label,
.darkMode .ms-ComboBox:not(.is-disabled) > .ms-ComboBox-Input,
.darkMode .ms-ComboBox-container:not(.darkModeLabelDisabled) .ms-Label,
.darkMode .metadataPositionIcons2 i,
.darkMode .ms-DetailsRow-cell,
.darkMode .ms-DetailsRow-cell div,
.darkMode .ms-DetailsHeader-cell,
.darkMode .ms-Panel-closeButton i {
  color: white !important;
}
.darkMode {
  /* Lower constrast white colour for disabled texts on boxes that require input and small icons in those boxes */
}
.darkMode .darkModeLabelDisabled > .ms-Label,
.darkMode .ms-ComboBox .ms-ComboBox-CaretDown-button,
.darkMode .ms-Dropdown-caretDown,
.darkMode .ms-SearchBox-clearButton,
.darkMode .ms-TextField.is-disabled input,
.darkMode .ms-TextField.is-disabled textarea,
.darkMode .ms-TextField.is-disabled .ms-Label,
.darkMode .ms-ComboBox i,
.darkMode .ms-TextField i {
  color: rgb(161, 159, 157) !important;
}
.darkMode {
  /* Lower constrast white colour for placeholder texts in input boxes. */
}
.darkMode ::-webkit-input-placeholder {
  color: rgb(161, 159, 157) !important;
  opacity: 1;
}
.darkMode ::-moz-placeholder {
  color: rgb(161, 159, 157) !important;
  opacity: 1;
}
.darkMode :-ms-input-placeholder {
  color: rgb(161, 159, 157) !important;
  opacity: 1;
}
.darkMode ::-ms-input-placeholder {
  color: rgb(161, 159, 157) !important;
  opacity: 1;
}
.darkMode ::placeholder {
  color: rgb(161, 159, 157) !important;
  opacity: 1;
}
.darkMode {
  /* Background colour for input boxes and labels */
}
.darkMode .ms-SearchBox,
.darkMode .ms-Dropdown-title,
.darkMode .ms-ComboBox,
.darkMode .ms-ComboBox-Input,
.darkMode .ms-TextField-fieldGroup,
.darkMode .ms-ComboBox .ms-ComboBox-CaretDown-button,
.darkMode .ms-SearchBox-clearButton *,
.darkMode .ms-SearchBox-iconContainer {
  background-color: black !important;
}
.darkMode .ms-SearchBox-field,
.darkMode .ms-TextField-field {
  background-color: black !important;
  color: white !important;
}
.darkMode {
  /* Main background colour for Teams */
}
.darkMode .suggestion-itemcontainer,
.darkMode .suggestion-itemcontainer .ms-DetailsHeader,
.darkMode .suggestion-itemcontainer .ms-DetailsHeader-cell:hover {
  background-color: #1f1f1f !important;
}
.darkMode {
  /* Low contrast hover background colour */
}
.darkMode .ms-Pivot > .ms-Pivot-link:hover,
.darkMode .ms-DetailsRow:hover,
.darkMode .suggestion-itemcontainer .ms-DetailsRow-cell:hover {
  background-color: #292929 !important;
}
.darkMode {
  /* Hovering over interactable boxes and buttons turns them grey to show they are selected */
}
.darkMode .metadataPositionIcons2 .ms-Button:hover i,
.darkMode .ms-SearchBox-clearButton:hover i,
.darkMode .ms-Panel-closeButton:hover i,
.darkMode .ms-ChoiceFieldLabel:hover,
.darkMode .ms-Checkbox-text:hover,
.darkMode .ms-Checkbox-checkmark:hover,
.darkMode .ms-Choicefield-field:hover,
.darkMode .ms-ChoiceField-field:hover .ms-ChoiceFieldLabel {
  color: grey !important;
}
.darkMode {
  /* Lighter red colour colour so errors are easier to read on a black background */
}
.darkMode .ms-TextField-errorMessage {
  color: rgb(251, 67, 76);
}

.lightMode {
  color: black;
}

.metadataWrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.metadataField {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 87%;
          flex: 0 0 87%;
}

.metadataPositionIcons {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  margin-top: 26px;
  margin-left: 20px;
}

.metadataField2 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 75%;
          flex: 0 0 75%;
}

.checkoutIcon {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 10%;
          flex: 0 0 10%;
}

.checkoutFileName {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  margin-top: 8px;
  font-size: 16px;
}

.metadataPositionIcons2 {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}

.notifyTeamLabelFontSize .ms-Checkbox-text {
  font-size: 16px;
}

.inlineflex .ms-ChoiceField {
  display: inline-block;
  margin-right: 15px;
}

.transparentDropdown {
  margin-right: 20px;
  margin-left: 5px;
}

.inline-block-container {
  display: grid;
  grid-template-columns: -webkit-max-content -webkit-max-content;
  grid-template-columns: max-content max-content;
  grid-gap: 5px;
}