.kb-doc-tool {
    margin: 24px 0;
    border: 1px solid var(--kb-border, #d5dee7);
    border-radius: var(--kb-radius, 8px);
    padding: clamp(16px, 2vw, 24px);
    background: var(--kb-surface-muted, #f5fbfe);
}

.kb-doc-tool__card {
    display: grid;
    gap: 14px;
}

.kb-doc-tool__title,
.kb-docs-wrap .kb-doc-tool__title {
    margin: 0;
    font-size: 20px;
}

.kb-doc-tool__description,
.kb-doc-tool__privacy,
.kb-doc-tool__status {
    margin: 0;
}

.kb-doc-tool__privacy {
    border-left: 4px solid var(--kb-admonition-warning, #f59c00);
    padding: 9px 12px;
    background: var(--kb-surface, #fff);
}

.kb-doc-tool__form,
.kb-doc-tool__fields {
    display: grid;
    gap: 12px;
}

.kb-doc-tool__field {
    display: grid;
    gap: 5px;
    max-width: 620px;
}

.kb-doc-tool__label {
    font-weight: 700;
}

.kb-doc-tool input,
.kb-doc-tool select {
    width: 100%;
    min-height: 42px;
    box-sizing: border-box;
    border: 1px solid var(--kb-border, #d5dee7);
    border-radius: 6px;
    padding: 8px 10px;
    background: var(--kb-surface, #fff);
    color: var(--kb-text, #1f2933);
}

.kb-doc-tool__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.kb-doc-tool__button {
    min-height: 40px;
    border: 1px solid var(--kb-accent, #2563eb);
    border-radius: 6px;
    padding: 8px 14px;
    background: var(--kb-accent, #2563eb);
    color: #fff;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.kb-doc-tool__button:disabled {
    cursor: not-allowed;
    opacity: 0.55;
}

.kb-doc-tool__result {
    display: block;
    min-height: 24px;
    border-radius: 6px;
    padding: 10px 12px;
    background: var(--kb-surface, #fff);
    overflow-wrap: anywhere;
}

.kb-doc-tool__result--secret {
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    word-break: break-all;
}

.kb-doc-tool__result.is-error,
.kb-doc-tool__error {
    color: #a32020;
}

.kb-doc-tool__sandbox {
    display: block;
    width: 100%;
    min-height: 160px;
    border: 0;
    background: #fff;
}

@media (max-width: 600px) {
    .kb-doc-tool {
        padding: 14px;
    }
}
