.site-text-editor {
    position: sticky;
    z-index: 80;
    top: .75rem;
    display: flex;
    align-items: center;
    gap: .5rem;
    width: fit-content;
    max-width: calc(100% - 1rem);
    margin: .75rem auto;
    padding: .55rem;
    border: 1px solid rgba(23, 117, 90, .2);
    border-radius: 14px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 10px 28px rgba(34, 48, 43, .12);
    backdrop-filter: blur(12px);
}

.site-text-editor__label,
.site-text-editor__status {
    color: #657069;
    font-size: .78rem;
    font-weight: 700;
}

.site-text-editor__button {
    min-height: 36px;
    padding: .45rem .75rem;
    border: 1px solid #d9ddd8;
    border-radius: 9px;
    background: #fff;
    color: #25302b;
    font: inherit;
    font-size: .82rem;
    font-weight: 800;
    cursor: pointer;
}

.site-text-editor__button--primary {
    border-color: #1e8c63;
    background: #1e8c63;
    color: #fff;
}

.site-text-editor__button:disabled { opacity: .55; cursor: wait; }

[data-site-text-root][data-site-text-editing="true"] [data-site-text-key] {
    outline: 1px dashed rgba(30, 140, 99, .7);
    outline-offset: 4px;
    cursor: text;
    white-space: pre-line;
}

[data-site-text-root][data-site-text-editing="true"] [data-site-text-key]:focus {
    outline: 2px solid #1e8c63;
    border-radius: 4px;
    background: rgba(30, 140, 99, .07);
}

@media (max-width: 640px) {
    .site-text-editor { flex-wrap: wrap; justify-content: center; }
    .site-text-editor__label { width: 100%; text-align: center; }
}
