/*
 * navbar
 */

body {
    /* space for navbar */
    padding-top: 70px;
}

.navbar .nav-link.active {
    /* Make highlight effect on active nav link stronger */
    font-weight: 500;
}

/*
 * Tooltip on span in dashboard card heads
 */

span[data-bs-toggle="tooltip"]:hover {
    outline: 2px solid black;
    border-radius: 4px;
}

p.card-text.display-5 a:hover {
    border-radius: 5px;
}

/*
 * Link in accordion head in dashboard
 */

.accordion-link-icon {
    opacity: 0;          /* unsichtbar */
    transition: opacity 0.2s ease;
}

.accordion-header:hover .accordion-link-icon {
    opacity: 1;          /* wird sichtbar beim Hover */
}

/*
 * Password entry with toggle: color full border on valid/invalid data
 */

.input-group:has(input.is-valid) .input-group-text {
    border-color: var(--bs-form-valid-border-color);
}

.input-group:has(input.is-invalid) .input-group-text {
    border-color: var(--bs-form-invalid-border-color);
}

/*
 * ALTCHA
 */

altcha-widget div.altcha {
    border-radius: 0.375rem;
    border: 1px solid #ced4da;
}

/*
 * ticket list
 */

table.table thead th.orderable.asc,
table.table thead th.orderable.desc {
    /* prepare header (th) in orderable columns to show an ordering caret */
    position: relative;
    padding-right: 1.8rem;
}

table.table thead th.orderable.asc::after,
table.table thead th.orderable.desc::after {
    /* configure font and positiong of ordering caret */
    font-family: bootstrap-icons !important;
    position: absolute;
    right: 0.5rem;
}

table.table thead th.orderable.asc::after {
    /* caret-up-fill */
    content: "\F235";
}

table.table thead th.orderable.desc::after {
    /* caret-down-fill */
    content: "\F229";     
}

/*
 * ticket details
 */

.mail-wrapper .toggle-mail {
    /* invisible by default */
    opacity: 0;
    transition: opacity 0.2s;
}

.mail-wrapper:hover .toggle-mail {
    /* shows on hover */
    opacity: 1;
}