/* Custom overrides for Fakturtool */
body {
    padding-top: 4.5rem;
}

.loader {
    border: 5px solid #f3f3f3;
    border-top: 5px solid #0d6efd; /* Bootstrap primary color */
    border-radius: 50%;
    width: 30px;
    height: 30px;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Toggle switch link */
.toggle-switch-link {
    display: inline-block;
    width: 2.5em;
    height: 1.25em;
    cursor: pointer;
    text-decoration: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-color: #adb5bd;
    background-position: left center;
    border-radius: 2em;
    border: none;
}

.toggle-switch-link:focus-visible {
    outline: 2px solid #0d6efd;
    outline-offset: 2px;
}

.toggle-switch-link.active {
    background-color: #0d6efd;
    background-position: right center;
}

/* Like Bootstrap's disabled .form-switch, label included */
.toggle-switch-link:disabled,
.toggle-switch-link:disabled + span {
    opacity: .5;
    cursor: default;
}

/* Sortable table headers */
[data-controller="sortable-table"] th {
    cursor: pointer;
    user-select: none;
}

[data-controller="sortable-table"] th::after {
    margin-left: 5px;
    color: #6c757d;
}

[data-controller="sortable-table"] th[data-sort="asc"]::after {
    content: '▲';
}

[data-controller="sortable-table"] th[data-sort="desc"]::after {
    content: '▼';
}

/* Header: signed-in user's avatar and menu */
.user-avatar{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:#0d6efd;color:#fff;font-size:13px;font-weight:600;letter-spacing:.02em;border:2px solid rgba(255,255,255,.55)}
.user-avatar-lg{width:40px;height:40px;font-size:15px;border:0;flex:none}
.user-menu{width:280px;overflow:hidden}
.min-w-0{min-width:0}

/* Mandatory fields: Symfony marks their labels with "required" — for radios each option too */
.mark-required .required:not(.form-check-label)::after{content:" *";color:var(--bs-danger)}