/* Editor preview widths */
.is-mobile-preview {
    max-width: 390px;
    margin: 0 auto;
}

.is-tablet-preview {
    max-width: 820px;
    margin: 0 auto;
}

/* Hide blocks in editor preview modes */
.is-desktop-preview .hidden-desktop,
.is-tablet-preview .hidden-tablet,
.is-mobile-preview .hidden-mobile,
body.is-desktop-preview .hidden-desktop,
body.is-tablet-preview .hidden-tablet,
body.is-mobile-preview .hidden-mobile,
.editor-styles-wrapper .is-desktop-preview .hidden-desktop,
.editor-styles-wrapper .is-tablet-preview .hidden-tablet,
.editor-styles-wrapper .is-mobile-preview .hidden-mobile {
    display: none !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Frontend visibility with specificity for navigation items */
@media (min-width: 1025px) {

    .hidden-desktop,
    .wp-block-navigation .wp-block-navigation-item.hidden-desktop {
        display: none !important;
    }
}

@media (min-width: 641px) and (max-width: 1024px) {

    .hidden-tablet,
    .wp-block-navigation .wp-block-navigation-item.hidden-tablet {
        display: none !important;
    }
}

@media (max-width: 640px) {

    .hidden-mobile,
    .wp-block-navigation .wp-block-navigation-item.hidden-mobile {
        display: none !important;
    }
}

/* Responsive visibility icon styling */
.responsive-visibility-icon {
    display: inline-flex;
    align-items: center;
    margin-left: 8px;
    opacity: 0.6;
    cursor: help;
    vertical-align: middle;
    transition: opacity 0.2s ease;
}

.responsive-visibility-icon:hover {
    opacity: 1;
}