authentik/passbook/core/static/css/passbook.css

.navbar-brand-name {
    height: 35px;
}

.dynamic-array-widget .array-item {
  display: flex;
  align-items: center;
  margin-bottom: 15px;
}

.dynamic-array-widget .remove_sign {
  width: 10px;
  height: 2px;
  background: #a41515;
  border-radius: 1px;
}

.dynamic-array-widget .remove {
  height: 15px;
  display: flex;
  align-items: center;
  margin-left: 5px;
}

.dynamic-array-widget .remove:hover {
  cursor: pointer;
}

/* Selector */
.selector {
    display: flex;
    width: 100%;
    height: 45vh;
}

.selector .selector-filter {
    display: flex;
    align-items: center;
}

.selector .selector-filter label {
    margin: 0 8px 0 0;
}

.selector .selector-filter input {
    width: auto;
    min-height: 0;
    flex: 1 1;
}

.selector-available, .selector-chosen {
    width: auto;
    flex: 1 1;
    display: flex;
    flex-direction: column;
}

.selector select {
    width: 100%;
    flex: 1 0 auto;
    margin-bottom: 5px;
}

.selector ul.selector-chooser {
    width: 26px;
    height: 52px;
    padding: 2px 0;
    margin: auto 15px;
    border-radius: 20px;
    transform: translateY(-10px);
    list-style: none;
}

.selector-add, .selector-remove {
    width: 20px;
    height: 20px;
    background-size: 20px auto;
}

.selector-add {
    background-position: 0 -120px;
}

.selector-remove {
    background-position: 0 -80px;
}

a.selector-chooseall, a.selector-clearall {
    align-self: center;
}

.stacked {
    flex-direction: column;
    max-width: 480px;
}

.stacked > * {
    flex: 0 1 auto;
}

.stacked select {
    margin-bottom: 0;
}

.stacked .selector-available, .stacked .selector-chosen {
    width: auto;
}

.stacked ul.selector-chooser {
    width: 52px;
    height: 26px;
    padding: 0 2px;
    margin: 15px auto;
    transform: none;
}

.stacked .selector-chooser li {
    padding: 3px;
}

.stacked .selector-add, .stacked .selector-remove {
    background-size: 20px auto;
}

.stacked .selector-add {
    background-position: 0 -40px;
}

.stacked .active.selector-add {
    background-position: 0 -60px;
}

.stacked .selector-remove {
    background-position: 0 0;
}

.stacked .active.selector-remove {
    background-position: 0 -20px;
}

.help-tooltip, .selector .help-icon {
    display: none;
}

form .form-row p.datetime {
    width: 100%;
}

.datetime input {
    width: 50%;
    max-width: 120px;
}

.datetime span {
    font-size: 13px;
}

.datetime .timezonewarning {
    display: block;
    font-size: 11px;
    color: #999;
}

.datetimeshortcuts {
    color: #ccc;
}

.inline-group {
    overflow: auto;
}

.selector-add, .selector-remove {
    width: 16px;
    height: 16px;
    display: block;
    text-indent: -3000px;
    overflow: hidden;
    cursor: default;
    opacity: 0.3;
}

.active.selector-add, .active.selector-remove {
    opacity: 1;
}

.active.selector-add:hover, .active.selector-remove:hover {
    cursor: pointer;
}

.selector-add {
    background: url(../admin/img/selector-icons.svg) 0 -96px no-repeat;
}

.active.selector-add:focus, .active.selector-add:hover {
    background-position: 0 -112px;
}

.selector-remove {
    background: url(../admin/img/selector-icons.svg) 0 -64px no-repeat;
}

input[data-is-monospace] {
    font-family: monospace;
}