
/* FOUC STYLES - Basically all blocks and also content animated with HOC 
    1.   - hide using styles 
    2a.  - if Javascript is NOT available     => show using styles inside the noscript tag
    2b.  - if Javascript is available         =>  show using javascript
*/
.ssq-not-hydrated{
    // visibility:hidden;
}


/* BORDERS */
.ssq-border-red{
    border: 1px solid red;
    box-sizing: border-box;
}
.ssq-border-green{
    border: 1px solid green;
    box-sizing: border-box;
}
.ssq-border-green-dashed{
    border: 1px dashed green;
    box-sizing: border-box;
}
.ssq-border-blue{
    border: 1px solid blue;
    box-sizing: border-box;
}
.ssq-border-blue-dashed{
    border: 1px dashed blue;
    box-sizing: border-box;
}
.ssq-border-purple{
    border: 1px solid purple;
    box-sizing: border-box;
}
.ssq-border-purple-dashed{
    border: 1px dashed purple;
    box-sizing: border-box;
}
/* 
UTILITY CLASSES
*/
.ssq-relative {
    position:relative;
}
.ssq-absolute {
    position:absolute;
}
.ssq-fixed {
    position:fixed;
}
.ssq-sticky {
    position:sticky;
}
.ssq-top-0{
    top:0;
}
.ssq-left-0{
    left:0;
}
.ssq-right-0{
    right:0;
}
.ssq-inset {
    inset:0;
}
.ssq-pointer-events-auto{
    pointer-events:auto;
}
.ssq-pointer-events-none{
    pointer-events:none;
}
.ssq-flex {
    display: flex;  
}



.ssq-pointer-events-child-auto > * {
    pointer-events: auto;
}

.ssq-pointer-events-child-none > * {
    pointer-events: none!important; // for block editor to work and override the default behavior
}
    
// Position: Top
.ssq-hoc-scene-top-left {
    align-items: flex-start;
    justify-content: flex-start;
}
.ssq-hoc-scene-top-center {
    align-items: flex-start;
    justify-content: center;
}
.ssq-hoc-scene-top-right {
    align-items: flex-start;
    justify-content: flex-end;
}
// Position: Center
.ssq-hoc-scene-center-left {
    align-items: center;
    justify-content: flex-start;
}
.ssq-hoc-scene-center-center {
    align-items: center;
    justify-content: center;
}
.ssq-hoc-scene-center-right {
    align-items: center;
    justify-content: flex-end;
}
// Position: Bottom
.ssq-hoc-scene-bottom-left {
    align-items: flex-end;
    justify-content: flex-start;
}
.ssq-hoc-scene-bottom-center {
    align-items: flex-end;
    justify-content: center;
}
.ssq-hoc-scene-bottom-right {
    align-items: flex-end;
    justify-content: flex-end;
}


.zzzz{
    z-index: -9999;
}


.ssq-c2d-tools-tabs > .components-tab-panel__tabs {
    overflow-x: auto;
}