.hopframe-header {
    background-color: var(--neutral-layer-4) !important;
    border-bottom: calc(var(--stroke-width) * 2px) solid var(--accent-fill-rest) !important;
    color: var(--neutral-foreground-rest) !important;
}

.hopframe-content {
    align-self: stretch !important;
    width: 100%;
}

.hopframe-main {
    min-height: calc(100dvh - 86px);
    color: var(--neutral-foreground-rest);
    align-items: stretch !important;
    column-gap: 0 !important;
}

.hopframe-toolbar {
    width: 100%;
    padding: 0.5rem 1.5rem;
}

.hopframe-listview {
    background: padding-box linear-gradient(var(--neutral-fill-input-rest), var(--neutral-fill-input-rest)), border-box var(--neutral-stroke-input-rest);
    border: calc(var(--stroke-width) * 1px) solid transparent;
    border-radius: calc(var(--control-corner-radius) * 1px);
    padding: 0 calc(var(--design-unit) * 2px + 1px);
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    width: 100%;
    height: 32px;
}

.hopframe-content .empty-content-row.empty-content-cell {
    border: none !important;
}

fluent-option {
    background: transparent !important;
}

body {
    --body-font: "Segoe UI Variable", "Segoe UI", sans-serif;
    font-family: var(--body-font), sans-serif;
    font-size: var(--type-ramp-base-font-size);
    line-height: var(--type-ramp-base-line-height);
    margin: 0;
}

footer {
    background: var(--neutral-layer-4);
    color: var(--neutral-foreground-rest);
    align-items: center;
    padding: 10px 10px;
}

footer a {
    color: var(--neutral-foreground-rest);
    text-decoration: none;
}

footer a:focus {
    outline: 1px dashed;
    outline-offset: 3px;
}

footer a:hover {
    text-decoration: underline;
}

.column-header.select-all > svg {
    display: none;
}