/* DGS List Block Editor Styles */

/* Force the block to have proper margin in editor */
.dgs-list-block {
    margin-top: var(--space-m);
    margin-bottom: var(--space-m);
}

/* Ensure the list items are editable */
.dgs-list__text .rich-text {
    display: inline;
}

/* Editor placeholder styling */
.dgs-list__text [data-rich-text-placeholder]:after {
    color: var(--neutral-light);
    opacity: 0.8;
}

/* Make sure icons maintain their size in editor */
.dgs-list__icon {
    pointer-events: none;
}

/* Ensure proper spacing in editor */
.editor-styles-wrapper .dgs-list__item {
    margin-bottom: var(--space-s);
}

/* Hover state in editor */
.editor-styles-wrapper .dgs-list__item:hover .dgs-list__icon {
    transform: translateX(2px);
}

/* Repeater controls styling */
.block-editor-block-inspector .components-panel__body .blockstudio-repeater {
    margin-top: var(--space-xs);
}

/* Style the drag handle and controls */
.blockstudio-repeater-item {
    border: 1px solid var(--wp-admin-theme-color-lighter-20);
    border-radius: 4px;
    margin-bottom: var(--space-xs);
    background: var(--wp-components-color-background);
}

.blockstudio-repeater-item:hover {
    border-color: var(--wp-admin-theme-color);
}

/* Ensure drag handle is visible */
.blockstudio-repeater-item .drag-handle {
    cursor: move;
    opacity: 0.5;
    transition: opacity 0.2s;
}

.blockstudio-repeater-item:hover .drag-handle {
    opacity: 1;
}

/* Add some spacing for the reorder controls */
.blockstudio-repeater-controls {
    display: flex;
    gap: 4px;
    align-items: center;
}