/* Quill margin-bottom toolbar dropdown labels */
.ql-margin-bottom {
    width: 80px;
}

.ql-picker.ql-margin-bottom .ql-picker-label::before,
.ql-picker.ql-margin-bottom .ql-picker-item::before {
    content: 'Margin';
}

.ql-picker.ql-margin-bottom .ql-picker-label[data-value="1"]::before,
.ql-picker.ql-margin-bottom .ql-picker-item[data-value="1"]::before { content: '1'; }
.ql-picker.ql-margin-bottom .ql-picker-label[data-value="2"]::before,
.ql-picker.ql-margin-bottom .ql-picker-item[data-value="2"]::before { content: '2'; }
.ql-picker.ql-margin-bottom .ql-picker-label[data-value="3"]::before,
.ql-picker.ql-margin-bottom .ql-picker-item[data-value="3"]::before { content: '3'; }
.ql-picker.ql-margin-bottom .ql-picker-label[data-value="4"]::before,
.ql-picker.ql-margin-bottom .ql-picker-item[data-value="4"]::before { content: '4'; }
.ql-picker.ql-margin-bottom .ql-picker-label[data-value="5"]::before,
.ql-picker.ql-margin-bottom .ql-picker-item[data-value="5"]::before { content: '5'; }

/* Fraction display in structured list (andel) */
.fraction-container {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 1.6rem;
    line-height: 2rem;
}

.slash {
    color: #9ca3af;
    font-size: 2rem;
    padding-left: 4px;
    padding-right: 4px;
}

.parenthesis {
    color: #9ca3af;
    font-size: 1.8rem;
    padding-left: 4px;
    padding-right: 4px;
}

.total-percentage {
    font-weight: 600;
    font-size: 1.8rem;
    color: #374151;
}

.total-number {
    font-weight: 600;
    font-size: 1.8rem;
    color: #374151;
}

.andel-label {
    color: #6b7280;
    font-size: 1.8rem;
    margin-left: 0.25rem;
}

/* Make first column expand, others shrink to content */
@media screen and (min-width: 767px) {
    .table-expand-first {
        width: 100%;
    }

    .table-expand-first td:not(:first-child) {
        width: 1%;
        white-space: nowrap;
    }

    .table-expand-first td:first-child,
    .table-expand-first th[scope="row"] {
        width: 5%;
        font-weight: 700;
    }
}

/* External link icon via CSS — used by both FDExternalLink and CMS content links. */
a.function-link.icon-link::after {
    content: '';
    display: inline-block;
    width: 1em;
    height: 1em;
    margin-left: 0.25em;
    vertical-align: middle;
    background: url('_content/FaellesDesign/img/svg-icons/open-in-new.svg') no-repeat center / contain;
}