﻿/*
    Well-Known Classes:
    (Classes that target single attributes should be annotated with `!important`, so that they are not accidentially overridden by CSS selector chains.)
*/
.w-100 {
  width: 100% !important;
}

.w-auto {
  width: auto !important;
}

.h-100 {
  height: 100% !important;
}

.h-auto {
  height: auto !important;
}

.h-100vh {
  height: 100vh !important;
}

.h-80vh {
  height: 80vh !important;
}

.c-mud-palette-text-primary {
  color: var(--mud-palette-text-primary) !important;
}

.c-mud-palette-appbar-text {
  color: var(--mud-palette-appbar-text) !important;
}

.fill-mud-palette-appbar-text {
  fill: var(--mud-palette-appbar-text) !important;
}

.fill-sws-red {
  fill: #e60000ff !important;
}

.ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/*
    Improve: Feedback
*/
.errors-as-warnings:has([aria-invalid="true"]) {
  --mud-palette-error: var(--mud-palette-warning);
  --mud-palette-error-darken: var(--mud-palette-warning-darken);
  --mud-palette-error-lighten: var(--mud-palette-warning-lighten);
}

/*
    Improve: Image fallbacks
*/
.image-fallback {
  width: 100%;
  height: 100%;
}

  .image-fallback .fallback {
    display: none;
    align-items: center;
    justify-content: center;
  }

  .image-fallback img {
    display: block;
  }

    .image-fallback img[src="hide"] {
      display: none !important;
    }

  .image-fallback:has(img[src="hide"]) .fallback {
    display: flex;
  }

/*
    Improve: Default style for tables
*/
.mud-table-cell:has(.mud-table-row-expander),
.mud-table-cell:has(.mud-table-cell-checkbox) {
  max-width: 48px;
}

.mud-table-row.group-header {
  background-color: var(--mud-palette-background-gray);
}

/*
    Improve: Enable custom SVG icons in MudButton
*/
.mud-button .mud-button-label:has(svg:not(.mud-svg-icon)) {
  display: flex;
  flex-direction: row;
}

.mud-button .mud-button-label svg:not(.mud-svg-icon) {
  height: 1.75em;
  width: 100%;
}

/*
    Improve: Responsive Design - Mud-Dialog Dense
*/
.mud-dialog.dense {
  width: 100%;
}

  .mud-dialog.dense .mud-dialog-content {
    padding: 0;
  }

@media (min-width: 600px) {
  .mud-dialog.dense {
    width: calc(100% - 0.5em);
  }

    .mud-dialog.dense .mud-dialog-content {
      padding: 0 0.5em 0.375em 0.5em;
    }
}

@media (min-width: 960px) {
  .mud-dialog.dense {
    width: calc(100% - 1em);
  }

    .mud-dialog.dense .mud-dialog-content {
      padding: 0 1em 0.75em 1em;
    }
}

@media (min-width: 1280px) {
  .mud-dialog.dense {
    width: calc(100% - 2em);
  }

    .mud-dialog.dense .mud-dialog-content {
      padding: 0 2em 1.5em 2em;
    }
}

@media (min-width:1920px) {
  .mud-dialog.dense {
    width: calc(100% - 3em);

    .mud-dialog.dense .mud-dialog-content {
      padding: 0 3em 2.25em 3em;
    }
  }
}

@media (min-width:2560px) {
  .mud-dialog.dense {
    width: calc(100% - 4em);

    .mud-dialog.dense .mud-dialog-content {
      padding: 0 4em 3em 4em;
    }
  }
}
