/*****************************
Frontend Overrides
******************************/

@keyframes replaceFadeIn {
    from {--replace-ui-fadein: 0;}
    to {--replace-ui-fadein: 1;}
}

bodycopy {
    animation: replaceFadeIn 500ms cubic-bezier(0.25, 0.1, 0.25, 1) 0.3s forwards;
}


.page.overlay[editing="true"] bodycopy,
.page.fixed[editing="true"] bodycopy {
    pointer-events: auto !important;
}


[editing="true"] media-item {
    pointer-events:auto;
}

[editing="true"] [blog-gallery] media-item {
    pointer-events: none;
}


/*****************************
Necessary CSS For Editor shadow dom elements
******************************/


::selection {
    background-color: rgba(129, 188, 255, 0.6);
}


body.dragging-in-editor media-item, body.dragging-in-editor .wallpaper::part(media-item) {
    pointer-events: auto!important;
}

body.dragging,
body.dragging *,
body.dragging a,
body.dragging ::part(link) {
    cursor:ew-resize!important;
}

/* "Lorem Ipsum" Text for Empty pages in the admin */
bodycopy[contenteditable="true"].empty-editor:after {
   /* content: "Lorem ipsum…"; */
    cursor: text;
    opacity: 0.4;
    width: 0;
    overflow: visible;
    white-space: nowrap;
}

bodycopy[contenteditable="true"].empty-editor br {
    display: none;
}

media-item[suppress-placeholder-ui="true"]::part(placeholder-ui){
    display: none!important;
}

/* Content Testing IFRAME */
#contentEditableStyleTester {
    top: 0;
}

#editor-overlay.selecting {
    pointer-events:none!important;
}

body.mobile #editor-overlay {
    --baseColor-accent-rgb: 0, 122, 255;
    --baseColor-accent2-rgb: 255, 0, 0;
}