@import url("./dev-banner.css");

/* Reset the root font size to override system settings that may create issues during development */
html {
   font-size: 16px;
}

.current-wip {
   outline: 2px solid hsla(60, 100%, 50%, 1);
   /* background-image: url("../assets/images/bg/bg-grid.png"); */
}





.__disable__ {
   display: none !important;
}

/* Hide page content for distraction free container styling */
body:has(.hide-content:checked) {
   *:not(.dev-banner, .dev-banner *):where(p, :not(:has(>*))) {visibility: hidden;}
}


/* Enable hierarchical outlining */
body:has(.hierarchy-on-hover:checked) {
   /* Apply outlines to hovered elements to show filial hierarchy */
   *:hover {
      &:has(:hover) {outline: 2px dotted red;}
      *:not(:has(:hover)):hover {
         outline: 2px dashed blue;


         > * { outline: 1px dashed green; }
      }
   }
}


/* Enable X-Ray Vision */
body:has(.x-ray:checked) {
   *:not(.dev-banner, .dev-banner *) {
      opacity: 0.60 !important;
   }
}