.fi-json-column pre.prettyjson {
    color: black;
    background-color: ghostwhite;
    padding: 20px 25px;
    overflow: auto;
}

:is(.dark) .fi-json-column pre.prettyjson {
    opacity: .7;
    --tw-bg-opacity: 1;
    --tw-border-opacity: 1;
    background-color: #161617;
    color: rgb(209 213 219/var(--tw-text-opacity));
}

:is(.dark) .fi-json-column pre.prettyjson span.json-key {
    color: red !important;
}

:is(.dark) .fi-json-column pre.prettyjson span.json-string {
    color: aquamarine !important;
}

:is(.dark) .fi-json-column pre.prettyjson span.json-value {
    color: deepskyblue !important;
}

.master.fi-json-column {
    border: #e5e7eb solid 1px;
}

.fi-json-column .control {
    cursor: pointer;
    padding: 0.875rem 1.25rem;
}

:is(.dark) .fi-json-column .control:hover {
    background-color: #161617;
}

.fi-json-column .control:hover {
    background-color: #F9FAFB;
}

.fi-json-column .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: white;
    border-bottom: #e5e7eb solid 1px;
}

:is(.dark) .fi-json-column .container {
    background-color: transparent !important;
    border-bottom: hsla(0,0%,100%,.2) solid 1px !important;
}

:is(.dark) .fi-json-column .master {
    border: hsla(0,0%,100%,.2) solid 1px !important;
}

.fi-json-column .active {
    background-color: #F9FAFB;
}

:is(.dark) .fi-json-column .active {
    background-color: #161617 !important;
}
