/**
 * CM Menus Block - Centralized CSS
 * Four-selector pattern for FSE compatibility
 */

/* Block wrapper styles */
.wp-block-w4ya-cm-menus,
.editor-styles-wrapper .wp-block-w4ya-cm-menus,
.wp-block-w4ya-cm-menus *,
.editor-styles-wrapper .wp-block-w4ya-cm-menus * {
    box-sizing: border-box;
}

/* Apply custom CSS properties if set via block attributes */
.wp-block-w4ya-cm-menus,
.editor-styles-wrapper .wp-block-w4ya-cm-menus {
    color: var(--cm-menus-text-color, inherit);
    margin-top: var(--cm-menus-margin-top, 0);
    margin-right: var(--cm-menus-margin-right, 0);
    margin-bottom: var(--cm-menus-margin-bottom, 0);
    margin-left: var(--cm-menus-margin-left, 0);
}

/* Editor wrapper styles */
.cm-menus-editor-wrapper,
.editor-styles-wrapper .cm-menus-editor-wrapper {
    position: relative;
}

/* Preview label in editor */
.cm-menus-editor-wrapper > div:first-child,
.editor-styles-wrapper .cm-menus-editor-wrapper > div:first-child {
    position: absolute;
    top: 5px;
    right: 10px;
    background: #f0f0f0;
    padding: 2px 8px;
    font-size: 11px;
    color: #666;
    border-radius: 3px;
    z-index: 10;
}

/* When dragging on to the stage from FSE librarythis is required to make it visible */
.editor-styles-wrapper #north-menu {
    opacity: 1 !important;
}