/**
 * @file
 * Layout spezieller Komponenten
 */

/* Neuerdings hat sich das Layout der Status-Meldungen geändert?! */
div.alert > svg {
  max-width: 1rem;
  max-height: 1rem;
}
div.alert > div > h2,
div.alert > div > hr:first-of-type {
  display: none;
}

/** Block Benutzer-Info aus Links, Maskierungsinfo und Logo (im Kopfbereich der Website) */
.block-benutzer-info {
  font-size: 0.85em;
}
.block-benutzer-info a {
  text-decoration: none;
}
.block-benutzer-info .benutzerinfo-links {
  min-width: 5em;
}
.block-benutzer-info .benutzerinfo-links h4 {
  font-size: 1.1em;
  color: var(--rot);
  margin-bottom: 0;
}
.block-benutzer-info .benutzerinfo-logo {
  max-width: 33vw;
}
.block-benutzer-info .benutzerinfo-logo img {
  max-width: 100%;
  min-width: 80px;
}


/** Kacheln / Menüpunkte als Kacheln **/
.card.kachel {
  background-color: var(--lichtblau);
}
.card.kachel:hover, .card.kachel:focus {
  background-color: var(--hellblau);
  color: white;
}
.card.kachel .card-title {
  margin-bottom: 0;
}
.card.kachel .card-body {
  padding-top: 0;
}
.card.kachel h4 {
  font-size: var(--font-size-base);
  hyphens: auto;
}
.card.kachel .card-text {
  font-size: 0.9em;
}
.card.kachel img {
  max-width: 100%;
  height: auto;
}

.page-link {
  color: var(--blau);
}
.page-item.active .page-link {
  border-color: var(--blau);
  background-color: var(--blau);
}

/** Aktionsknöpfe in der Seitenleiste (z.B. bei Detailansicht Anfrage) */
.sidebar .block-local-tasks-block .nav-tabs {
  border-bottom: none;
  margin-left: 0;
}
.sidebar .block-local-tasks-block nav.tabs {
  margin-bottom: 0;
}
.sidebar .block-local-tasks-block .nav-tabs .nav-link {
  padding: 0.1rem 0.3rem;
  margin-right: 0.5rem;
  margin-bottom: 0.5rem;
  background-color: var(--lichtblau);
  border-radius: 0.25rem;
  border: 1px solid var(--hellgrau);
}
.sidebar .block-local-tasks-block .nav-tabs .active .nav-link {
  background-color: unset;
  border: 1px solid var(--lichtblau);
}

/** Anfragedaten (Webform Submission) **/
.webformdaten {
  font-size: 0.9rem;
  background-color: var(--lichtbeige);
  max-height: 30em;
  overflow-y: scroll;
  padding: 0.3em;
}
.webformdaten label {
  display: inline-block;
  min-width: 25%;
  color: var(--grau);
}
.webformdaten .field-value {
  display: inline-block;
  max-width: 73%;
  vertical-align: top;
}

.webformdaten .mb-3 {
  margin-bottom: 0.2rem !important;
}


/**
 * Einfache Akkordeon-Funktion (für Blöcke)
 * (per JS werden zus. Attribute gesetzt)
 */
.akkordeon .akkordeon-titel  {
  cursor: pointer;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,border-radius .15s ease;
}
.akkordeon .akkordeon-titel::before {
  display: inline-block;
  flex-shrink: 0;
  width: 1.7rem;
  height: 0.9rem;
  margin-left: auto;
  margin-right: 0.3rem;
  margin-top: 0.1rem;
  content: "";
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-size: 1.5rem;
  background-position: center;
  transition: transform .2s ease-in-out;
}
.akkordeon h2.akkordeon-titel::before {
  height: 1.4rem;
}
.akkordeon .akkordeon-titel[aria-expanded="true"]::before {
  transform: rotate(180deg);
}
.akkordeon .akkordeon-titel:hover::before {
  background-color: var(--lichtblau);
}


/* Kommentare */
.comment__content {
  border-radius: 0.5rem;
  background-color: var(--hellbeige);
}
.comment--unpublished .comment__content {
  background-color: var(--lichtgrau);
}
.comment__content::before, .comment__content::after {
  display: none;
}
.comment__content .field--name-comment-body {
  padding: 0.75rem 0.25rem;
  background-color: rgba(255,255,255, 0.5);
}
.comment__links nav.links {
  float: right;
  padding-bottom: 0;
}
.comment__links nav.links .nav-link {
  background-color: var(--weiss);
  border: 1px solid var(--hellgrau);
  border-radius: 0.25rem;
  font-size: 0.85rem;
  padding: 0 0.3rem;
  margin-left: 0.5rem;
  margin-top: 0.25rem;
}
/* Kommentare bei Anfragen und Angeboten als normale Liste (neueste oben) ohne Verschachtelung */
.view-kommentare-seite .indented {
  margin-left: inherit;
}

/* Datei-Upload-Knopf deutlicher gestalten */
input[type=file]::file-selector-button {
  margin-right: 1em;
  border: none;
  background: var(--blau);
  padding: 0.3em 1em;
  border-radius: 0.5em;
  color: var(--weiss);
  cursor: pointer;
  transition: background .2s ease-in-out;
}
.form-control:hover:not(:disabled):not([readonly])::file-selector-button {
  background-color: var(--dunkelblau);
}
.form-type-managed-file .form-managed-file {
  background-color: var(--weiss);
}

/* Datei-Feld kompakter (Dateiliste mit Upload-Feld) */
.field--type-file.kompakt .tabledrag-toggle-weight-wrapper,
.field--type-file.kompakt  thead,
.field--type-file.kompakt  td.checkbox,
.field--type-file.kompakt .form-managed-file small.description {
  display: none;
}
.field--type-file.kompakt .form-managed-file div.js-form-item.mb-3 {
  margin-bottom: 0 !important;
}
.field--type-file.kompakt .form-managed-file input {
  display: inline-block;
  width: auto;
  margin-left: 1em;
}

.form-type-managed-file button {
  padding: 0.3rem 1rem;
  line-height: 100%;
  font-size: 0.9em;
}