/* Ajustos propis sobre Tabler (https://tabler.io). Les variables de Tabler porten el prefix --tblr-, no --bs-. */

/* Logo: el dibuix és negre sobre blanc; el mostrem com un segell rodó perquè es veja també en mode fosc */
.marca-logo {
  border-radius: 50%;
  background: #fff;
}

/* Tabler reparteix logo i nom als extrems (space-between); els volem junts.
   Mateix selector que el de Tabler perquè guanye per ordre. */
.navbar-vertical.navbar-expand-lg .navbar-brand {
  justify-content: flex-start;
}

.barra-cerca {
  width: 22rem;
  max-width: 100%;
}

/* Formularis senzills i confirmacions: no cal que ocupen tota l'amplada */
.card-formulari {
  max-width: 48rem;
}

/* Taules dins de targetes: sense marge inferior perquè la targeta tanque neta */
.card > .table-responsive > .table,
.card > .table {
  margin-bottom: 0;
}

/* Botó «+» al costat d'un camp: a l'altura del camp, no de l'etiqueta (línia de l'etiqueta + el seu marge) */
.boto-grup-nou {
  margin-top: 1.75rem;
}

/* Llistes de definició (fitxes de peça, actuació, usuari) */
.fitxa dt {
  font-weight: var(--tblr-font-weight-medium);
  color: var(--tblr-secondary);
}
.fitxa dd {
  margin-bottom: 0.75rem;
}

/* Select2 (django-select2) amb l'aspecte dels camps de Tabler, en clar i en fosc.
   El prefix `body` és perquè guanyen al CSS de Select2, que {{ form.media }} carrega més avall. */
body .select2-container--default .select2-selection--single,
body .select2-container--default .select2-selection--multiple {
  min-height: calc(2.25rem + 2px);
  background-color: var(--tblr-bg-forms);
  border: var(--tblr-border-width) solid var(--tblr-border-color);
  border-radius: var(--tblr-border-radius);
}
body .select2-container--default.select2-container--focus .select2-selection--multiple,
body .select2-container--default.select2-container--open .select2-selection--single,
body .select2-container--default.select2-container--open .select2-selection--multiple {
  border-color: var(--tblr-primary);
  box-shadow: 0 0 0 0.25rem rgba(var(--tblr-primary-rgb), 0.25);
}
body .select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 2.25rem;
  color: var(--tblr-body-color);
}
body .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 2.25rem;
}
body .select2-container--default .select2-selection--multiple .select2-selection__choice {
  color: var(--tblr-body-color);
  background-color: var(--tblr-bg-surface-secondary);
  border: var(--tblr-border-width) solid var(--tblr-border-color);
  border-radius: var(--tblr-border-radius);
}
body .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
  color: var(--tblr-secondary);
}
body .select2-dropdown {
  color: var(--tblr-body-color);
  background-color: var(--tblr-bg-surface);
  border-color: var(--tblr-border-color);
}
body .select2-container--default .select2-search--inline .select2-search__field {
  color: var(--tblr-body-color);
}
body .select2-container--default .select2-search--dropdown .select2-search__field {
  color: var(--tblr-body-color);
  background-color: var(--tblr-bg-forms);
  border-color: var(--tblr-border-color);
}
body .select2-container--default .select2-results__option[aria-selected=true],
body .select2-container--default .select2-results__option--selected {
  background-color: var(--tblr-bg-surface-secondary);
}
body .select2-container--default .select2-results__option--highlighted[aria-selected],
body .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  color: #fff;
  background-color: var(--tblr-primary);
}

/* Impressió (fitxes i informes de comptabilitat): només el contingut, sense menús */
@media print {
  .navbar-vertical,
  .footer {
    display: none !important;
  }
  .page-wrapper {
    margin-left: 0 !important;
  }
  .card {
    box-shadow: none;
  }
}
